個人開発のWebサービスは、実は「書いたコード」だけでは動きません。ホスティング、データベース、認証、アクセス解析 — 外部サービスの組み合わせ方が、開発体験と維持費をほぼ決めます。
この記事では、このサイト(個人開発アプリの紹介プラットフォーム AppVillage)が実際に使っている外部サービスを、選んだ理由・無料枠の実感・ハマった注意点・費用まで含めて全部公開します。これから構成を決める人の「下敷き」になれば嬉しいです。
この記事で分かること
- 個人開発Webサービスの実際の外部サービス構成(実例)
- 各サービスを選んだ理由と、無料枠でどこまで運用できるかの実感
- 実際にハマった注意点(無料枠の落とし穴など)
- 毎月の費用の実額感
結論: インフラの課金はSupabase Proだけ。1〜2プロジェクトなら無料で始まる
先に全体像です。
| 役割 | 使用サービス | 費用 |
|---|---|---|
| ホスティング・デプロイ | Vercel | 無料枠 |
| 認証・DB・画像ストレージ | Supabase | Proプラン $25/月 ※ |
| コード管理 | GitHub | 無料 |
| アクセス解析 | Google Analytics 4 | 無料 |
| 検索管理 | Google Search Console | 無料 |
| ドメイン(.jp) | 年3,000円前後 | 月換算 約250円 |
| 開発 | Claude Code | 有料プラン |
| 画像生成 | ChatGPT | 有料プラン |
※Supabaseの課金理由は性能ではなくプロジェクト数です。無料枠で持てるのは2プロジェクトまでで、複数アプリのバックエンドを運用している筆者は上限を超えたためPro。AppVillage単体なら無料枠で収まる規模です。
インフラでお金がかかっているのはそのSupabase Proだけ。あとはドメイン代と「作るスピードを買う」ためのAIツール代です。1つ目のサービスなら、個人開発の維持費は思っているよりずっと小さくできます。
全体の構成
【ユーザー側】
訪問者 → Vercel (ホスティング/CDN) → Next.js アプリ → Supabase (認証・DB・画像)
【開発側】
Claude Code で実装 → GitHub へ push → Vercel が自動デプロイ
【運営側】
GA4 (行動計測) / Search Console (検索流入) / ChatGPT (サムネイル等の画像)それぞれ紹介していきます。
Supabase — 認証・DB・画像ストレージ
役割: ユーザー認証(GitHub / Google ログイン)、PostgreSQLデータベース、投稿画像の保存。アプリの「データまわり」を一手に引き受けています。
選んだ理由:
- 認証とDBとストレージが1つのサービスで完結する。個人開発では「管理するものの数」がそのまま負担になるので、これが一番効く
- 無料枠で十分始められる
- 利用者が多く情報が豊富。これはAIコーディングとの相性にも直結します(情報が多い技術ほどAIが正確に書ける)
無料枠の実感: AppVillage単体なら無料枠で収まる規模です。ただし筆者は現在Proプラン($25/月)を使っています。理由は性能や容量ではなくプロジェクト数 — 無料枠で持てるのは2プロジェクトまでで、複数アプリのバックエンドを運用していて上限を超えたためです。
注意点: この「2プロジェクト上限」は、個人開発を続けるほど必ずぶつかる壁です。3つ目のサービスを作った時点で月$25の固定費が始まる前提で、プロジェクトの配分(役目を終えたプロジェクトの整理も含めて)を考えておきましょう。
Vercel — ホスティングと自動デプロイ
役割: サイトの配信。GitHubにpushすると自動でビルド・デプロイされます。
選んだ理由: Next.jsとの相性が抜群で、設定らしい設定をほぼしていません。「push したら本番に反映される」が最初から手に入ります。
実際にハマった注意点 — 画像最適化のクォータ:
Vercelの無料枠には、画像最適化(next/imageの変換)の回数制限があります。ユーザー投稿画像をすべて最適化に通していたら、ある月にクォータを使い切り、ある日突然サイトの画像が表示されなくなりました。コードは何も変えていないのに画像だけ消えるので、原因特定までかなり焦りました。
対処は「外部ストレージ配信の画像は最適化を通さない」設定にすること。詳しい経緯は開発実例の記事に書いています。無料枠は「量の上限」だけでなく「回数の上限」も見ておく — これがこの事件の教訓です。
GitHub — コード管理と「git = CMS」
役割: コード管理と、デプロイの起点(push → Vercel が反映)。
AppVillageでは少し変わった使い方をしていて、記事や月刊誌のコンテンツもすべてgitで管理しています。CMSやデータベースを使わず、Markdownファイルを push したら記事が公開される仕組みです。管理画面の開発・保守が丸ごと不要になるので、個人開発とは相性の良い割り切りだと思います。
Google Analytics 4 — 「送客」を測る
役割: アクセス解析。ただしPV数を眺めるだけでなく、独自イベントを実装しています。
- アプリ詳細からApp Store・公式サイトへの外部クリック(送客)
- アプリ投稿の完了
- 記事からアプリページへの回遊
AppVillageの価値は「掲載アプリへ送客できたか」なので、PVより送客数を主要KPIにしています。サービスの価値が何かを決めて、それを測るイベントを入れる — GA4はそこまでやって初めて役に立つ、というのが実感です。
Google Search Console — 検索とインデックスの管理
役割: 検索パフォーマンスの確認、サイトマップ送信、インデックス状況の管理。
村だよりの記事がどんな検索語で表示されているか、新しい記事がインデックスされたかはここで見ます。GA4が「来た後」の分析なら、Search Consoleは「来る前」の分析。この2つはセットで無料なので、入れない理由がないサービスです。
ドメイン — 唯一の「インフラ固定費」
.jp ドメインで年3,000円前後。月換算250円ほどで、これがインフラ側の唯一の固定費です。
ドメインは後から変えるとSEOの積み上げがリセットされるので、最初にちゃんと考える価値のある数少ない買い物です。迷ったら、サービス名そのままのシンプルなものを。
Claude Code — 開発そのもの
役割: 実装のほぼすべて。このサイトはコードの100%をClaude Codeが書いています。
外部サービスの文脈で言うと、Claude Codeの存在はサービス選定の基準も変えます。情報が豊富な定番サービス(Supabase、Vercelなど)ほどAIが正確に扱えるので、「定番を選ぶメリット」が以前より大きくなりました。マイナーで尖ったサービスを選ぶと、AIの精度もそのぶん落ちます。
使い方は入門記事にまとめています。
ChatGPT — 画像生成をデザイナー代わりに
役割: 記事のサムネイル、村だより(月刊誌)の表紙、サイトのヒーロー画像。この記事のサムネイルもそうです。
デザイナーに外注すると1枚数千円〜の世界ですが、画像生成でまかなえばプラン料金だけで枚数を気にせず作れます。個人開発の「デザイン力が足りない問題」への現実的な答えの1つだと思います。
費用まとめ
| 項目 | 月額の実感 |
|---|---|
| インフラ(Vercel + GA4 + Search Console + GitHub) | 0円 |
| Supabase | Proプラン $25/月(複数プロジェクト共通の固定費。1〜2プロジェクトなら0円) |
| ドメイン | 約250円(年3,000円前後) |
| AIツール(Claude Code + ChatGPT) | ここが投資のメイン |
つまり構造としては、「インフラはほぼ無料枠、お金は開発速度(AI)に集中投資」。Supabase Proの$25もAppVillage専用ではなく、複数プロジェクトで分け合う共通費です。サーバー代に月数千円かかった時代と比べると、個人開発の損益分岐点は劇的に下がっています。
選び方の考え方(これから構成を決める人へ)
- ホスティング+DBのセットから決める — ここが決まると認証・デプロイ・データ管理まで一気に形になります
- 無料枠から始めて、必要になったら払う — 最初から有料プランを予約する必要はありません。ただし無料枠の「回数制限」は事前に確認を
- 定番を選ぶ — 情報の多さは、困ったときの解決速度と、AIコーディングの精度に直結します
- 無料でも「測る」ものは最初から入れる — GA4とSearch Consoleは後から入れると過去のデータが取れません
まとめ
- AppVillageの外部サービス構成は Vercel + Supabase + GitHub + GA4 + Search Console + ドメイン + AIツール
- インフラの課金はSupabase Pro(複数プロジェクト運用のため)のみ。1〜2プロジェクトなら無料枠で成立する
- 無料枠の落とし穴は「量」より「回数」(画像最適化クォータで実体験済み)
- サービス選定の新基準: 情報が多い定番ほど、AIコーディングの精度も高い
今後、この構成の中から Supabase や Vercel の深掘り記事も書いていく予定です。あなたのアプリが完成したら、ぜひ村でも紹介してください。
※本記事の情報は執筆時点のものです。各サービスの料金・無料枠は変更されることがあるため、最新情報は公式サイトをご確認ください。
