関連テンプレ構成
テンプレート
# システムアーキテクチャ
## システム全体構成図
### 概要
システム全体の論理的および物理的な構成を示す。主要なコンポーネント(サブシステム)、サーバー、ネットワークの配置を明確化する。
### システム構成図
```mermaid
graph TB
subgraph "クライアント層"
A["Webブラウザ"]
B["モバイルアプリ"]
end
subgraph "プレゼンテーション層"
C["Webサーバー<br/>(Nginx/Apache)"]
end
subgraph "アプリケーション層"
D["APIサーバー<br/>(Node.js/Java)"]
E["バッチサーバー"]
end
subgraph "データ層"
F["データベース<br/>(PostgreSQL/MySQL)"]
G["キャッシュサーバー<br/>(Redis)"]
H["ファイルストレージ<br/>(S3/NAS)"]
end
subgraph "外部システム"
I["外部API"]
J["既存システム"]
end
A --> C
B --> C
C --> D
D --> F
D --> G
D --> H
D --> I
E --> F
D --> J
```
### コンポーネント説明
| コンポーネント名 | 役割 | 技術スタック | 備考 |
|------------------|------|--------------|------|
| Webブラウザ | ユーザーインターフェース | HTML/CSS/JavaScript | Chrome, Safari, Edge対応 |
| モバイルアプリ | モバイル向けUI | React Native / Flutter | iOS/Android対応 |
| Webサーバー | リクエスト受付・静的コンテンツ配信 | Nginx | リバースプロキシとして機能 |
| APIサーバー | ビジネスロジック処理 | Node.js + Express | RESTful API提供 |
| バッチサーバー | 定期処理・非同期処理 | Python | 夜間バッチ、データ集計等 |
| データベース | データ永続化 | PostgreSQL 14 | トランザクションデータ管理 |
| キャッシュサーバー | 高速データアクセス | Redis 7 | セッション管理、頻繁アクセスデータ |
| ファイルストレージ | ファイル保存 | AWS S3 | 画像、PDF等の保存 |
---
## アーキテクチャパターンと責務分割方針
### 採用アーキテクチャ
**レイヤードアーキテクチャ(3層アーキテクチャ)**を採用する。
### 採用理由
- 各層の責務が明確で、保守性・拡張性が高い
- チーム分割がしやすく、並行開発が可能
- 技術スタックの変更が層単位で可能
- 実績が豊富で、開発メンバーの習熟度が高い
### 層別責務定義
#### プレゼンテーション層(Presentation Layer)
**責務:**
- ユーザーインターフェースの提供
- リクエストの受付とレスポンスの返却
- 入力値の基本的なバリデーション
- セッション管理
**含まれるコンポーネント:**
- Webサーバー(Nginx)
- フロントエンドアプリケーション(React)
**禁止事項:**
- ビジネスロジックの実装
- データベースへの直接アクセス
#### アプリケーション層(Application Layer / Business Logic Layer)
**責務:**
- ビジネスロジックの実装
- トランザクション制御
- データの整合性チェック
- 外部システムとの連携制御
**含まれるコンポーネント:**
- APIサーバー
- バッチサーバー
- ビジネスロジック処理モジュール
**禁止事項:**
- UI表示に関する処理
- データベース固有の処理の直接実装(DAOを経由する)
#### データ層(Data Layer)
**責務:**
- データの永続化
- データの読み取り・書き込み
- データの物理的な管理
**含まれるコンポーネント:**
- データベース(PostgreSQL)
- キャッシュサーバー(Redis)
- ファイルストレージ(S3)
**禁止事項:**
- ビジネスロジックの実装(ストアドプロシージャは最小限)
### コンポーネント間通信フロー
```mermaid
sequenceDiagram
participant U as ユーザー
participant P as プレゼンテーション層
participant A as アプリケーション層
participant D as データ層
U->>P: リクエスト送信
P->>P: 入力バリデーション
P->>A: APIコール
A->>A: ビジネスロジック実行
A->>D: データアクセス要求
D->>A: データ返却
A->>P: レスポンス返却
P->>U: 画面表示
```
---
## 採用技術スタック
### フロントエンド
| 技術要素 | 技術名 | バージョン | 採用理由 |
|----------|--------|------------|----------|
| フレームワーク | React | 18.x | コンポーネント指向、豊富なエコシステム |
| 状態管理 | Redux Toolkit | 1.9.x | 予測可能な状態管理、デバッグツール充実 |
| UIライブラリ | Material-UI | 5.x | デザイン統一、レスポンシブ対応 |
| ビルドツール | Vite | 4.x | 高速なビルド、HMR対応 |
| 言語 | TypeScript | 5.x | 型安全性、IDE支援充実 |
### バックエンド
| 技術要素 | 技術名 | バージョン | 採用理由 |
|----------|--------|------------|----------|
| 実行環境 | Node.js | 20.x LTS | 非同期処理に強い、JavaScript統一 |
| フレームワーク | Express | 4.x | シンプル、拡張性高い、実績豊富 |
| ORM | Prisma | 5.x | 型安全、マイグレーション管理容易 |
| バリデーション | Zod | 3.x | TypeScript統合、実行時型チェック |
| 言語 | TypeScript | 5.x | 型安全性、保守性向上 |
### データベース・ストレージ
| 技術要素 | 技術名 | バージョン | 採用理由 |
|----------|--------|------------|----------|
| RDB | PostgreSQL | 14.x | ACID特性、豊富な機能、実績 |
| キャッシュ | Redis | 7.x | 高速、セッション管理、Pub/Sub |
| オブジェクトストレージ | AWS S3 | - | 高可用性、スケーラビリティ |
### インフラ・DevOps
| 技術要素 | 技術名 | バージョン | 採用理由 |
|----------|--------|------------|----------|
| コンテナ | Docker | 24.x | 環境統一、デプロイ容易 |
| オーケストレーション | Kubernetes | 1.28.x | スケーラビリティ、自動復旧 |
| CI/CD | GitHub Actions | - | リポジトリ統合、無料枠充実 |
| モニタリング | Datadog | - | 統合監視、アラート機能 |
| ログ管理 | CloudWatch Logs | - | AWS統合、検索・分析機能 |
### 開発ツール
| 技術要素 | 技術名 | バージョン | 採用理由 |
|----------|--------|------------|----------|
| バージョン管理 | Git | - | 標準的なVCS |
| リポジトリ | GitHub | - | コラボレーション機能充実 |
| IDE | VSCode | - | 拡張機能豊富、軽量 |
| API設計 | OpenAPI (Swagger) | 3.x | API仕様の標準化 |
| テスト | Jest | 29.x | テストフレームワーク標準 |
### バッチ処理
| 技術要素 | 技術名 | バージョン | 採用理由 |
|----------|--------|------------|----------|
| 言語 | Python | 3.11.x | データ処理ライブラリ豊富 |
| スケジューラ | cron / AWS EventBridge | - | 定期実行の標準 |
| データ処理 | pandas | 2.x | データ分析・加工に最適 |
### 技術スタック選定基準
以下の基準に基づいて技術選定を実施した:
1. **実績と安定性**: 本番環境での十分な実績があること
2. **コミュニティとサポート**: 活発なコミュニティ、豊富なドキュメント
3. **学習コストとスキル**: チームメンバーの習熟度、習得容易性
4. **拡張性と保守性**: 将来の機能追加・変更への対応力
5. **ライセンスとコスト**: 商用利用可能、運用コストの妥当性
6. **セキュリティ**: セキュリティアップデートの提供状況
--- プレビュー
システムアーキテクチャ
システム全体構成図
概要
システム全体の論理的および物理的な構成を示す。主要なコンポーネント(サブシステム)、サーバー、ネットワークの配置を明確化する。
システム構成図
graph TB
subgraph "クライアント層"
A["Webブラウザ"]
B["モバイルアプリ"]
end
subgraph "プレゼンテーション層"
C["Webサーバー<br/>(Nginx/Apache)"]
end
subgraph "アプリケーション層"
D["APIサーバー<br/>(Node.js/Java)"]
E["バッチサーバー"]
end
subgraph "データ層"
F["データベース<br/>(PostgreSQL/MySQL)"]
G["キャッシュサーバー<br/>(Redis)"]
H["ファイルストレージ<br/>(S3/NAS)"]
end
subgraph "外部システム"
I["外部API"]
J["既存システム"]
end
A --> C
B --> C
C --> D
D --> F
D --> G
D --> H
D --> I
E --> F
D --> J
コンポーネント説明
| コンポーネント名 | 役割 | 技術スタック | 備考 |
|---|---|---|---|
| Webブラウザ | ユーザーインターフェース | HTML/CSS/JavaScript | Chrome, Safari, Edge対応 |
| モバイルアプリ | モバイル向けUI | React Native / Flutter | iOS/Android対応 |
| Webサーバー | リクエスト受付・静的コンテンツ配信 | Nginx | リバースプロキシとして機能 |
| APIサーバー | ビジネスロジック処理 | Node.js + Express | RESTful API提供 |
| バッチサーバー | 定期処理・非同期処理 | Python | 夜間バッチ、データ集計等 |
| データベース | データ永続化 | PostgreSQL 14 | トランザクションデータ管理 |
| キャッシュサーバー | 高速データアクセス | Redis 7 | セッション管理、頻繁アクセスデータ |
| ファイルストレージ | ファイル保存 | AWS S3 | 画像、PDF等の保存 |
アーキテクチャパターンと責務分割方針
採用アーキテクチャ
- *レイヤードアーキテクチャ(3層アーキテクチャ)**を採用する。
採用理由
- 各層の責務が明確で、保守性・拡張性が高い
- チーム分割がしやすく、並行開発が可能
- 技術スタックの変更が層単位で可能
- 実績が豊富で、開発メンバーの習熟度が高い
層別責務定義
プレゼンテーション層(Presentation Layer)
責務:
- ユーザーインターフェースの提供
- リクエストの受付とレスポンスの返却
- 入力値の基本的なバリデーション
- セッション管理
含まれるコンポーネント:
- Webサーバー(Nginx)
- フロントエンドアプリケーション(React)
禁止事項:
- ビジネスロジックの実装
- データベースへの直接アクセス
アプリケーション層(Application Layer / Business Logic Layer)
責務:
- ビジネスロジックの実装
- トランザクション制御
- データの整合性チェック
- 外部システムとの連携制御
含まれるコンポーネント:
- APIサーバー
- バッチサーバー
- ビジネスロジック処理モジュール
禁止事項:
- UI表示に関する処理
- データベース固有の処理の直接実装(DAOを経由する)
データ層(Data Layer)
責務:
- データの永続化
- データの読み取り・書き込み
- データの物理的な管理
含まれるコンポーネント:
- データベース(PostgreSQL)
- キャッシュサーバー(Redis)
- ファイルストレージ(S3)
禁止事項:
- ビジネスロジックの実装(ストアドプロシージャは最小限)
コンポーネント間通信フロー
sequenceDiagram
participant U as ユーザー
participant P as プレゼンテーション層
participant A as アプリケーション層
participant D as データ層
U->>P: リクエスト送信
P->>P: 入力バリデーション
P->>A: APIコール
A->>A: ビジネスロジック実行
A->>D: データアクセス要求
D->>A: データ返却
A->>P: レスポンス返却
P->>U: 画面表示
採用技術スタック
フロントエンド
| 技術要素 | 技術名 | バージョン | 採用理由 |
|---|---|---|---|
| フレームワーク | React | 18.x | コンポーネント指向、豊富なエコシステム |
| 状態管理 | Redux Toolkit | 1.9.x | 予測可能な状態管理、デバッグツール充実 |
| UIライブラリ | Material-UI | 5.x | デザイン統一、レスポンシブ対応 |
| ビルドツール | Vite | 4.x | 高速なビルド、HMR対応 |
| 言語 | TypeScript | 5.x | 型安全性、IDE支援充実 |
バックエンド
| 技術要素 | 技術名 | バージョン | 採用理由 |
|---|---|---|---|
| 実行環境 | Node.js | 20.x LTS | 非同期処理に強い、JavaScript統一 |
| フレームワーク | Express | 4.x | シンプル、拡張性高い、実績豊富 |
| ORM | Prisma | 5.x | 型安全、マイグレーション管理容易 |
| バリデーション | Zod | 3.x | TypeScript統合、実行時型チェック |
| 言語 | TypeScript | 5.x | 型安全性、保守性向上 |
データベース・ストレージ
| 技術要素 | 技術名 | バージョン | 採用理由 |
|---|---|---|---|
| RDB | PostgreSQL | 14.x | ACID特性、豊富な機能、実績 |
| キャッシュ | Redis | 7.x | 高速、セッション管理、Pub/Sub |
| オブジェクトストレージ | AWS S3 | - | 高可用性、スケーラビリティ |
インフラ・DevOps
| 技術要素 | 技術名 | バージョン | 採用理由 |
|---|---|---|---|
| コンテナ | Docker | 24.x | 環境統一、デプロイ容易 |
| オーケストレーション | Kubernetes | 1.28.x | スケーラビリティ、自動復旧 |
| CI/CD | GitHub Actions | - | リポジトリ統合、無料枠充実 |
| モニタリング | Datadog | - | 統合監視、アラート機能 |
| ログ管理 | CloudWatch Logs | - | AWS統合、検索・分析機能 |
開発ツール
| 技術要素 | 技術名 | バージョン | 採用理由 |
|---|---|---|---|
| バージョン管理 | Git | - | 標準的なVCS |
| リポジトリ | GitHub | - | コラボレーション機能充実 |
| IDE | VSCode | - | 拡張機能豊富、軽量 |
| API設計 | OpenAPI (Swagger) | 3.x | API仕様の標準化 |
| テスト | Jest | 29.x | テストフレームワーク標準 |
バッチ処理
| 技術要素 | 技術名 | バージョン | 採用理由 |
|---|---|---|---|
| 言語 | Python | 3.11.x | データ処理ライブラリ豊富 |
| スケジューラ | cron / AWS EventBridge | - | 定期実行の標準 |
| データ処理 | pandas | 2.x | データ分析・加工に最適 |
技術スタック選定基準
以下の基準に基づいて技術選定を実施した:
- 実績と安定性: 本番環境での十分な実績があること
- コミュニティとサポート: 活発なコミュニティ、豊富なドキュメント
- 学習コストとスキル: チームメンバーの習熟度、習得容易性
- 拡張性と保守性: 将来の機能追加・変更への対応力
- ライセンスとコスト: 商用利用可能、運用コストの妥当性
- セキュリティ: セキュリティアップデートの提供状況