Practice Storybook

概要

Storybook と React を組み合わせた開発の練習をするためのリポジトリです。

ビルドツールには Vite を採用し、 Storybook を起動するときにも利用しています。
またモック API として MSW を採用し、 Storybook と Jest を実行するときに利用しています。

Jest に関しては高速化のために、 @swc/jest を利用しています。

⚠️🚧 PWA はまだまだ調査中です。
インストールすることができたので、そのあたりについて記載しています。

ローカル環境で開発した Web アプリをインストールするためには、ビルドし、それを起動する必要があります。
そのため、まずは以下のコマンドを実行します。

yarn build
yarn preview

ブラウザで開き、アドレスバーに表示されているインストールボタンをクリックし、インストールする。

yarn dev

yarn storybook

yarn test:snapshot

yarn test:snapshot -u

Name		Name	Last commit message	Last commit date
Latest commit History 57 Commits
.devcontainer		.devcontainer
.husky		.husky
.storybook		.storybook
.vscode		.vscode
docs/img		docs/img
public		public
src		src
test		test
types/storybook-config		types/storybook-config
.env		.env
.env.development		.env.development
.env.production		.env.production
.env.test		.env.test
.eslintrc.json		.eslintrc.json
.gitignore		.gitignore
.prettierignore		.prettierignore
.prettierrc.json		.prettierrc.json
README.md		README.md
docker-compose.dev.yaml		docker-compose.dev.yaml
index.html		index.html
jest.config.components.ts		jest.config.components.ts
jest.config.storyshots.ts		jest.config.storyshots.ts
jest.config.ts		jest.config.ts
jest.setup.ts		jest.setup.ts
package.json		package.json
storyshots.spec.ts		storyshots.spec.ts
tsconfig.json		tsconfig.json
tsconfig.paths.json		tsconfig.paths.json
vite.config.ts		vite.config.ts
yarn.lock		yarn.lock