ゆめみパスポート フロントエンドコーディング試験

• ウェブサイト：https://yumemi-passport-frontend-2024.r4ai.dev/
• Storybook：https://yumemi-passport-frontend-2024.r4ai.dev/storybook/
• テストカバレッジ：https://app.codecov.io/gh/r4ai/yumemi-passport-frontend

🤖 Tech Stack

• Build tool: Vite
• UI Framework: React
• Styling: Panda CSS
• Routing: TanStack Router
• Data fetching: TanStack Query
• Charting: Recharts
• Icons: Lucide
• Testing:
  • Storybook
  • Vitest

💻 Development

コマンド	説明
bun install	依存関係のインストール
bun run dev	開発サーバーの起動
bun run build	ビルド
bun run preview	ビルド結果のプレビュー
bun run storybook	Storybookの起動
bun run storybook:build	Storybookのビルド
bun run storybook:test	Storybookによるコンポーネントテストの実行
bun run vitest	Vitestによる単体テストの実行
bun run format	Prettierによるコードフォーマットの実行
bun run lint:fix	ESLintによるコードのリントを実行

🚀 QuickStart

Warning

実行には .tool-versions に記載されたバージョンの Node.js と Bun が必要です。

mise もしくは asdf 等を利用している場合は、mise install もしくは asdf install によってインストールできます。

1. 環境変数の設定

   .dev.vars.example の内容を参考に、RESAS API Key を設定した .dev.vars ファイルを作成してください

2. 依存関係のインストール

   bun install

3. 開発サーバーの起動

   bun run dev

4. Storybook の起動

   bun run storybook

5. Storybookによるコンポーネントテストの実行

   bun run storybook:test

6. Vitest による単体テストの実行

   bun run vitest

7. ビルド

   bun run build