Next.js (App Router)

決定

UIライブラリとしてReactを、フレームワークとしてNext.js (App Router) を採用する。

Reactは主要なUIライブラリの中で最もコミュニティが大きく、ライブラリ・ツール・学習リソースの選択肢が圧倒的に多い。業務システム開発で必要になるUIコンポーネント、フォーム管理、状態管理などのライブラリが豊富に揃っている。

Reactエンジニアの母数が多く、チーム拡大時の採用面で有利である。

Reactを採用した上で、フレームワークの選択肢はNext.js、Remix等がある。

npmダウンロード数、GitHubスター数、Stack Overflowの質問数のいずれも最大であり、問題解決時の情報源が豊富である。

API Routes、ミドルウェア、Server Actionsを備えており、フロントエンドとバックエンドを単一フレームワークで構築できる。小規模チームにおいて、リポジトリやデプロイの分離による管理コストを避けられる。

App Routerのディレクトリ構造がそのままURL構造になるため、業務システムの画面構成（従業員一覧、シフト管理、勤怠管理等）を直感的にマッピングできる。

Vercelへのデプロイがゼロコンフィグで完了する。プレビュー環境の自動生成やエッジネットワークなど、インフラの管理コストを最小限にできる。

next/image により、リクエスト時の自動リサイズ・フォーマット変換（WebP/AVIF）、遅延読み込み、CLS防止が組み込みで提供される。外部ライブラリなしで画像最適化が完結する。

CSR中心の設計から始め、必要に応じてSSRやServer Componentを導入できる。初期段階で過剰な設計判断を迫られない。