Technology stack

技術を責務ごとに確認するため、全体構成・フロントエンド・バックエンドの3つのレイヤーに分けて記載します。

採用状況

アプリ全体の構成・実行環境・サービス間の通信を扱うレイヤーです。ここでは個別ライブラリではなく、システムとしての役割を確認します。

責務	採用技術・方式	採用状況
リポジトリ管理	pnpm Workspaces / Turborepo によるモノレポ	採用済み
共通言語	TypeScript	採用済み
アプリ構成	ブラウザ向け SPA、REST API、PostgreSQL	採用済み
通信形式	HTTPS / JSON による REST API	採用予定
実行・配信基盤	Cloudflare	採用済み
データベース基盤	Neon の PostgreSQL。develop / production ブランチで環境を分離	採用済み

画面表示、画面遷移、ユーザー操作、APIとの通信を担います。業務ルールや権限判定の最終判断はバックエンドに置きます。

責務	採用技術・方式	採用状況
UI アプリケーション	React / Vite / TypeScript	採用済み
画面遷移	React Router	採用済み
スタイリング	Tailwind CSS	採用済み
アイコン	Hugeicons	採用済み
画面内の状態管理	React のローカル state。入力途中の値・フィルター・開閉状態を管理する	採用済み
Server State 管理	TanStack Query v5。取得・キャッシュ・更新後の再取得を feature ごとに管理する	採用済み
入力値の検証	Zod。フォーム入力を送信前に検証し、バックエンドと同じルールを共有できる形を目指す	採用予定
API 通信	Cookie を含めた Fetch API による REST API 呼び出し	採用済み

認証・認可、入力検証、業務ルール、トランザクション整合性、永続化を担います。フロントエンドから渡された値を信用せず、このレイヤーで最終的に検証します。

責務	採用技術・方式	採用状況
API フレームワーク	Hono / TypeScript	採用済み
実行環境	Cloudflare Workers	採用済み
認証・セッション	Better Auth のログイン ID・パスワード認証。事前作成済みの2アカウントだけをログイン可能にする	採用済み
認可	ログインユーザーとグループ所属・ロールに基づくアクセス制御	採用予定
リクエスト検証	Zod。APIの入力値を検証し、エラー形式を統一する	採用予定
データアクセス	Drizzle ORM / @neondatabase/serverless	採用済み
スキーマ・マイグレーション	Drizzle Kit。マイグレーションは Neon の develop / production にそれぞれ適用する	採用済み
テスト	Vitest。スキーマ・制約・業務ルールを検証する	採用済み

実装を開始していない採用予定の技術は、導入時に依存関係・環境変数・マイグレーションを追加し、このページの状態を「採用済み」へ更新します。

フロントエンドの取得・更新とキャッシュのルールは Server State の管理を参照してください。