技術スタック概要
社内プロダクトで採用している技術スタックの一覧と、各ADRへのリンク。
技術スタック一覧
社内プロダクトの基盤となる技術スタック。各技術の選定理由は個別のADRに記載している。
| カテゴリ | 技術 | ADR |
|---|---|---|
| フレームワーク | Next.js (App Router) | Framework |
| スタイリング | Tailwind CSS v4 + CVA | Styling |
| UIライブラリ | @bi-shop-it/ui(独自) | Bishop UI |
| API | tRPC + TanStack Query | API |
| データベース | PostgreSQL + Drizzle ORM | Database |
| バリデーション | Valibot | Validation |
| 認証 | Better Auth | Authentication |
| 日付処理 | 自前実装 (@bi-shop-it/lib/date) | Date |
| テスト | Vitest + Playwright | Testing |
前提
業務システムの開発
業務用のWebアプリケーションを対象とする
AI駆動開発
実装は原則AIが行なう。人間はコードを書かない。
技術選定の方針
技術選定において、以下の3つを重視する。
- AIを使ったワークフローを組みやすい
- 人間がレビューしやすい
- 堅牢で、バグが起きにくい
これらを満たすために、技術選定では以下を大事にする。
コミュニティが大きい
AIの学習データが豊富なため、コード生成の精度が高くなる。マイナーな技術だとAIがハルシネーションを起こしやすい。また、人間にとっても情報源が多く、問題解決が速い。
型情報が充実している
AIがコードベースの文脈を正確に把握でき、「この関数は何を受け取り何を返すか」を推論なしに判断できる。レビューアにとっては、変更の影響範囲をコンパイラが検出するため、頭で追う必要がなくなる。型の不整合はコンパイル時にバグとして検出される。
宣言的なパターンである
宣言的なコード(JSX、スキーマ定義、ルーター定義等)はAIが構造を理解しやすく、正確に生成・修正できる。人間にとっても「何をしているか」が見た目でわかり、レビューの認知負荷が下がる。
規約が明文化・自動化されている
ESLint・Prettierで矯正できれば、AIが生成したコードを自動で規約に揃えられる。diffにスタイルの差分が混ざらないため、レビューは「ロジックの変更」だけに集中できる。
不変性を優先する
const 優先、破壊的変更の回避、純粋関数の優先により、予測困難な状態変更を減らす。AIにとってもデータの流れが追いやすく、人間にとっても副作用の影響範囲を限定できる。
外部依存を最小限にする
依存が増えるほど、セキュリティリスク、メンテナンスコスト、バンドルサイズの肥大化が発生する。標準APIで済むことにライブラリを入れない。ただし、自前実装のリスクが高い領域(認証、アクセシビリティ、DB操作等)では検証済みライブラリを採用する。