| フレームワーク |
Next.js 15 App Router |
サービス化・アーキテクチャ案 - AWSシステム構成 の「Amplify/NextJS」と整合。サーバーコンポーネントで認証トークンをクライアント JS に露出させない |
| ランタイム / ツーリング |
Bun, Biome, Lefthook, TypeScript 5.9 |
api-admin と統一し、モノレポ設定を流用可能 |
| UI キット |
shadcn/ui + Tailwind v4 + Radix |
ソースを自プロジェクトで所有。バックオフィス CRUD の定番 |
| データフェッチ |
TanStack Query v5 |
キャッシュ、無効化、楽観的更新、ページネーション |
| API クライアント |
Orval が /api/v1/doc から TanStack Query フック + TS 型 + Zod を生成 |
単一のコードジェンステップ。詳細: セットアップ |
| テーブル |
TanStack Table v8 |
ヘッドレス。shadcn の DataTable パターンと相性良 |
| フォーム |
React Hook Form + Zod(Orval 生成) |
zodResolver に Orval 生成スキーマを渡す |
| URL 状態 |
nuqs |
フィルタ・ページ・ソートを URL に保持 |
| i18n |
next-intl |
ja / en(ドキュメントと揃える) |
| テスト |
Vitest + Testing Library + Playwright |
Vitest は api-admin と同じ |
| デプロイ |
AWS Amplify Hosting |
サービス化・アーキテクチャ案 - AWSシステム構成 と整合 |