本サイト『CloudQuiz』をご利用いただきありがとうございます。
今回は、エンジニアやIT学習者の皆様から特に関心の高かった 「個人開発におけるインフラコスト問題」 について、全6,000問以上・340ページ超のWebアプリケーションを 「初期費用・月額維持費 ほぼ0円」 かつ 「爆速表示」 で運用しているAWSアーキテクチャの裏側を公開します。
💸 個人開発の最大の敵は「ランニングコスト」
個人開発でWebサービスを作る際、一番のネックになるのが**サーバー代（インフラコスト）**です。
よくある「EC2 + RDS（MySQL等）」の構成にしてしまうと、アクセスがゼロでも月額数千円〜1万円が固定で飛んでいきます。これでは収益化する前に心が折れてしまいます。
そこで『CloudQuiz』では、以下の3つをインフラ要件として設定しました。
- 完全な従量課金制（アクセスがない時は0円）
- AWSの Always Free（永久無料枠）を最大限活用
- SPA並みの表示速度とSEOの両立
これを実現したのが Next.js (SSG) × AWS Serverless の構成です。
🏗️ 採用したアーキテクチャ
本アプリのインフラ構成図は以下のようになっています。
graph TD
User["👤 ユーザー"] -->|"アクセス"| CF["⚡ Amazon CloudFront"]
CF -->|"キャッシュ配信"| S3["📦 Amazon S3 (Next.js SSG静的ファイル)"]
User -->|"認証"| Cognito["🔐 Amazon Cognito"]
User -->|"お気に入り機能等"| API["🌐 API Gateway"]
API -->|"処理"| Lambda["⚡ AWS Lambda"]
Lambda -->|"データ保存"| DDB["🗄️ DynamoDB (Pay-Per-Request)"]
1. フロントエンド：Next.js の SSG (Static Site Generation)
CloudQuizは全6,000問以上の問題データをJSONとして保持しています。
これをリクエストのたびにデータベースにクエリを投げて描画（SSR）すると、DBの維持費と処理コストがかさみます。
そこで Next.js の SSG を採用し、デプロイ時に 全340ページ分の問題をすべて静的なHTMLとして生成 しています。
2. 配信：Amazon S3 + CloudFront (月額0円の立役者)
生成された静的HTMLやアセット（CSS/画像）は、すべて Amazon S3 に配置し、CloudFront (CDN) 経由で配信しています。
- S3: ストレージ料金はGB単価で数円〜数十円。静的ファイルのみなので、実質月額数円〜0円レベル。
- CloudFront: AWSの無料利用枠として 毎月 1TB のデータ転送が永久無料。個人開発レベルのアクセスなら、CloudFrontの転送料金がかかることはほぼありません。
- さらに世界中のエッジロケーションからキャッシュが爆速で返されるため、ユーザーの体感速度は圧倒的になります。
3. 動的機能：Cognito + DynamoDB のオンデマンド課金
「お気に入り（ブックマーク）」機能などの動的なユーザーデータはどうしているのか？
ここも固定費のかかるRDSは使わず、以下のサーバーレス構成をとっています。
- 認証: Amazon Cognito (MAU 50,000人まで永久無料)
- データベース: Amazon DynamoDB (オンデマンドキャパシティモード / Pay-Per-Request)
- DynamoDB はリクエスト単位の課金であり、さらに25GB分のストレージと月間2億リクエストまでが永久無料枠に入っています。
🚀 CDK (Infrastructure as Code) での運用自動化
さらに、本プロジェクトでは AWS CDK (TypeScript) を用いて、これらのインフラをすべてコード化（IaC）してデプロイを自動化しています。
// infrastructure/lib/cloudquiz-stack.ts の一部抜粋
const bookmarksTable = new dynamodb.Table(this, 'CloudQuizBookmarksTable', {
tableName: 'CloudQuizBookmarks',
partitionKey: { name: 'userId', type: dynamodb.AttributeType.STRING },
sortKey: { name: 'examId', type: dynamodb.AttributeType.STRING },
billingMode: dynamodb.BillingMode.PAY_PER_REQUEST, // オンデマンド課金 (0円運用)
removalPolicy: cdk.RemovalPolicy.RETAIN,
});
🎯 まとめ
「Next.js (SSG) × S3 × CloudFront」および「フルサーバーレスバックエンド」を採用したことで、以下のROI（投資対効果）を実現できました。
- 維持費: 月額 約0円（無料枠内）
- パフォーマンス: 爆速（CDNキャッシュ）
- 運用負荷: ゼロ（NoOps）
個人開発で「コストが怖くてアプリを作れない」と悩んでいる方の参考になれば幸いです！
CloudQuizを利用して、ぜひインフラ構成の裏側を想像しながら勉強してみてくださいね。