Storybookを学ぶ
Reactのコンポーネントを提供しているnpmパッケージを含んでいるモノレポの中で、そのコンポーネントの動作を目視で確認できる仕組みが欲しかったのでStorybookでどうだろうかと思ってドキュメントを読んだりした。
monorepoを1つのStorybookで管理したい!その手順と遭遇した問題を解説します。 | ビジネスとIT活用に役立つ情報(株式会社アーティス)
現在開発中のフロントエンドのプロジェクトではアプリケーションを横断して使用するコンポーネントが必要なこともあり、pnpm workspace を利用した monorepo 構成を取っています。 アプリケーション開発では、...
www.asobou.co.jp

UIコンポーネント系のリポジトリはどうしているのか?
有名どころのUIコンポーネント系のリポジトリはどうしているのか?をまず調べたら良かったと気づく。
-
apps以下にドキュメント用のアプリケーションがある
GitHub - shadcn-ui/ui: Composable, accessible components with thoughtful defaults. Build your own component library with code you can customize, extend, and make your own.Composable, accessible components with thoughtful defaults. Build your own component library with code you can customize, extend, and make your own. - shadcn-ui/uigithub.comGitHub - heroui-inc/heroui: 🚀 Beautiful, fast and modern React UI library. (Previously NextUI)🚀 Beautiful, fast and modern React UI library. (Previously NextUI) - heroui-inc/herouigithub.com -
example以下にフレームワーク毎のサンプルプロジェクトを作る
-
Storybook使ってる
https://github.com/chakra-ui/chakra-ui
sandboxというディレクトリが存在する。こういうのでよさそう。
packages/eslint-config-customを作ったけど、ESLintの設定はkuma-uiの感じでも良いのではないかと思った。kuma-uiのリポジトリが全体的にシンプルでいい感じだったのでもう少ししっかり見る。
過去の日記
npmパッケージ公開に関する日記を整理する。