Azure
Static Web Apps (Azure SWA)
Azure Static Web Apps + Azure CDN + Azure Functions のJAMstack構成。GitHub Actionsと深く統合されたCI/CDにより、プルリクエストごとにステージング環境が自動生成され、本番デプロイまでの工数を大幅に削減します。
アーキテクチャ構成図
GitHub プッシュ / PR作成
GitHub Actions
ビルド・Lint・テスト
Azure Static Web Apps
デプロイ + プレビューURL自動生成
Azure CDN
エッジキャッシュ
Azure Functions v4
APIルート / 認証
Azure AD
組み込み認証・ロールベースアクセス
↑ リクエスト / データの流れ（上から下）
採用サービス構成
- ホスティング
- Azure Static Web Apps
- CDN
- Azure CDN
- バックエンドAPI
- Azure Functions
- CI/CD
- GitHub Actions
代表的なユースケース
- ✓Reactフロントエンドのホスティング
- ✓Azure AD認証付きSPAアプリ
- ✓APIバックエンド込みのJAMstackサービス
- ✓プレビュー環境を活用したデザインレビュー
このパターンを選ぶ判断基準
GitHubでソースを管理しており、プレビューデプロイを含むCI/CDをゼロ設定で実現したい場合。Azure ADによる組み込み認証も設定不要で利用できます。