TL;DR

月額約$7でAIアプリをフルスタック運用できた
Cloudflare (Workers/D1/R2) + RunPod Serverless + Vercel の組み合わせが最強
固定費を避けてServerless構成にすれば、個人開発でも安心

はじめに

こんにちは！普段はAIエンジニアとして働いています。外国人で初めて日本語で文章を書くので、おかしいところがあれば、ご指摘いただけると嬉しいです！

「フルスタック開発ってどんな感じだろう？」「個人でもサービスを公開できるのかな？」

そんな好奇心から、暇の時にAI証明写真生成サービスの開発を試しました。（実は仕事で大量の画像分析AIを作ったのがきっかけです笑）

開発中はかなり遠回りをしましたが、最終的に月額約7ドルでフルスタックのAIアプリを運用できる構成にたどり着きました。この記事では、その試行錯誤の過程と、各サービスの無料枠について詳しく解説します。

開発期間は約3〜4ヶ月でした。AIエンジニアなのでPythonは得意ですが、フロントエンドやTypeScriptはほぼ未経験。最初はかなり苦労しました。ただ、Claude CodeやChatGPTを活用したおかげで、学習スピードもコーディングスピードも大幅に上がりました。

実際の月額コスト

サービス	月額	用途	備考
Vercel	$0	フロントエンドのホスティング	無料枠内
Cloudflare Workers	$5	バックエンドAPI（ビジネスロジック）	画像の後処理、印刷テンプレート作成でCPU計算が少し必要なので、有料プランに昇格
Cloudflare D1	$0	データベース（SQLite）	無料枠内
Cloudflare R2	$0	画像ファイルの保存（オブジェクトストレージ）	無料枠内
RunPod	~$5	AI推論（背景除去、顔検出など）	利用量次第（1回の推論あたり約$0.01、今はほぼ無料）
Stripe	決済額の3.6%	決済システム	売上次第（全然使う人がいない笑）
Resend	$0	メール送信	月3,000通まで無料
ドメイン	~$10/年	独自ドメイン	年払い

合計: 約$7/月

AI推論とドメイン以外はほぼ無料枠で収まっています。

作ったもの

AIを使った証明写真生成サービスです。写真をアップロードすると、背景除去・顔検出・自動トリミング・美肌補正を行い、パスポートや履歴書用の証明写真を生成します。印刷用テンプレートも自動生成され、フチなし印刷時の拡大によるズレにも対応しています。コンビニ印刷にも対応しており、現在はプリンター会社とAPI連携の交渉中で、コンビニ印刷の自動登録機能を開発中です。

サービス名: ラムネAI証明写真
URL: https://ramune-photo.com

試行錯誤の記録

AIエンジニアなので、まず「AI処理」から着手しました。これが遠回りの始まりでした。

Phase 1: Pythonで全部やろうとした時代

最初の構成：
FastAPI (Python) → 全部入り → VPS(AWS EC2)にデプロイ

AIエンジニアにありがちな発想で、「バックエンドから着手して、ソースコードも全部Pythonで書けばいいじゃん」と思っていました。

やったこと:

FastAPIでAPIサーバーを構築
AI推論もビジネスロジックも同じサーバーに
VPS(AWS EC2)を契約してデプロイ

ぶつかった壁:

GPU付きVPSは月額数万円かかる
AI推論がない時間帯も課金され続ける
個人開発で固定費が高いのは精神的にきつい

「このサービス、誰も使わなかったらどうしよう...」という不安が常にありました。

Phase 2: フロントエンドの開発

バックエンドが一通り動くようになったので、フロントエンドの開発に着手しました。

技術選定:

Next.js + React：定番の組み合わせ
Vercel：デプロイが楽
TailwindCSS：スタイリングが速い

フロントエンドを作りながら気づいたこと：

APIの設計がフロントエンド視点で考えられていなかった
「このレスポンス、フロントで使いにくいな...」の連続
APIを何度も修正するはめに

学び: フロントエンドとバックエンドは並行して開発すべき。APIの設計は「使う側」の視点が必要。

Phase 3: GPU Serverlessとの出会い

フロントエンドも完成し、サービスとしては動くようになりました。しかし、VPSの固定費が気になっていました。

「使った分だけ払えばいいのでは？」という当たり前のことに気づき、RunPod Serverlessを発見。

RunPodの仕組み:

GPUを必要な時だけ起動
処理が終わったら自動でシャットダウン
秒単位で課金

これでAI推論のコストが劇的に下がりました。Cold Start Time（ウォームアップ）はありますが、1回の推論に対してExecution Time（全体にかかる時間）は20~30秒前後なので、許容範囲内でした。

ただし、ビジネスロジック（支払い処理、データベース操作など）はまだVPS上のPythonで動いていました。

Phase 4: バックエンドの迷走

AI推論をServerless化できたので、次はビジネスロジックもServerless化しようと考えました。より小さいEC2に移行してコストは下がりましたが、まだVPSに課金され続けていました。

候補1: AWS Lambda + Python

慣れたPythonが使える
でもAWSは設定が複雑で、個人開発には重い
料金体系も分かりにくい

候補2: Vercel Serverless Functions

フロントエンドと一緒にデプロイできて楽
でもNode.jsの実行時間制限が厳しい
画像処理には向かない

候補3: Cloudflare Workers

エッジで動くので爆速
無料枠が太っ腹（10万リクエスト/日）
ただしNode.jsではなくWorkers独自のランタイム

Cloudflareはより安価で安定したサービスを提供しているため、最終的にCloudflare Workersを選びました。

Phase 5: 現在の構成に至る

紆余曲折を経て、以下の構成に落ち着きました。

最終的なアーキテクチャ

┌─────────────────────────────────────────────────────────────┐
│                        ユーザー                               │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                    フロントエンド                             │
│              Next.js 15 + React 19                          │
│                   (Vercel)                                  │
└─────────────────────────────────────────────────────────────┘
                              │
              ┌───────────────┴───────────────┐
              ▼                               ▼
┌──────────────────────────┐    ┌──────────────────────────┐
│    ビジネスロジック API     │    │      AI 推論 API         │
│   Hono + TypeScript      │    │   Python + PyTorch       │
│  (Cloudflare Workers)    │    │  (RunPod Serverless)     │
└──────────────────────────┘    └──────────────────────────┘
                │
    ┌───────────┼───────────┐
    ▼           ▼           ▼
┌────────┐ ┌─────────┐ ┌────────┐
│  D1    │ │   R2    │ │ Stripe │
│(SQLite)│ │(Storage)│ │ (決済)  │
└────────┘ └─────────┘ └────────┘

ポイント: AIの重い処理とビジネスロジックの軽い処理を分離しました。

技術選定の理由

なぜCloudflare Workersを選んだのか

1. 無料枠が大きい

サービス	無料枠
Cloudflare Workers	10万リクエスト/日
AWS Lambda	100万リクエスト/月
Vercel Functions	15万実行/月

一見AWSの方が多く見えますが、Cloudflareは「日」単位なので、月換算だと約300万リクエスト相当です。

2. エグレス（データ転送）が無料

これが決め手でした。画像を扱うサービスなので、ダウンロード時の転送料金が無料なのは大きいです。

AWS S3だと、ユーザーが画像をダウンロードするたびに課金されます。Cloudflare R2は完全無料。

3. HonoフレームワークとWranglerの存在

Cloudflare Workersの独自ランタイムは、Node.jsとは微妙に違います。でもHonoを使えば、Express.jsに近い書き心地で開発できます。Wranglerと組み合わせれば、デプロイも簡単です。

import { Hono } from 'hono';
import { cors } from 'hono/cors';

const app = new Hono();

app.use('*', cors());

app.get('/health', (c) => {
  return c.json({ status: 'ok' });
});

app.post('/api/process', async (c) => {
  const body = await c.req.json();
  // 処理
  return c.json({ result: 'success' });
});

export default app;

実は、Honoは日本人開発者のyusukebeさんが作ったフレームワークで、ドキュメントも充実しています。

4. $5/月の有料プランがコスパ最強

無料枠でも十分ですが、$5/月の有料プランに上げると世界が変わります。

プラン	CPU時間	リクエスト数
Free	10ms/リクエスト	10万/日
Paid ($5/月)	3,000万ms/月	1,000万/月

無料枠では1リクエストあたり10msのCPU時間しか使えず、本当に軽いAPIしか動かせません。しかし有料プランでは、月3,000万CPU msを上限として自由に使えます。1リクエストあたり最大30秒（設定で5分まで延長可能）の実行時間が許容されるので、画像のリサイズ、印刷テンプレート生成、PDFの作成など、ちゃんとしたアルゴリズム処理が余裕で動きます。

しかもこの5ドル/月はアカウント単位の料金なので、複数のプロジェクトで共有できます。本番環境とステージング環境を分けても、別サービスを立ち上げても、追加料金なし。月額$5で1,000万リクエスト、エグレス無料、エッジで爆速。個人開発でこれ以上のコスパは見つかりませんでした。

なぜRunPod Serverlessを選んだのか

1. GPUのServerlessが簡単に使える

Dockerイメージを用意してDocker Hubを通して管理（GitHubみたいにPull/Pushでバージョン管理）し、RunPodとの連携はハンドラー関数を書くだけ。

import runpod

def handler(job):
    input_data = job["input"]
    # GPU処理
    return {"result": "processed"}

runpod.serverless.start({"handler": handler})

2. 秒単位課金

GPU	料金
16GB GPU	$0.00016/s
24GB GPU	$0.00019/s
48GB GPU	$0.00034/s

1リクエストの処理が10秒なら(Warmupの間は無料)、16GB GPUで、約$0.0016。1000リクエストでも1.6ドル程度です。

3. Flex Workerでアイドル時は課金なし

使わない時間は完全に0円。個人開発の「誰も使わないかもしれない」という不安に対する最適解でした。

なぜNext.js + Vercelを選んだのか

正直、CI/CDが充実していて楽です。

Next.jsはReactのフルスタックフレームワークとして成熟している
VercelはNext.jsの開発元なので相性抜群
デプロイがgit pushだけで完了

個人開発ではインフラに時間をかけたくないので、「考えることが少ない」のは正義です。

ステージング環境が簡単に作れる

VercelもCloudflare Workersも、ステージング環境の構築が非常に簡単です。

Vercel:

ブランチごとに自動でプレビューURLが生成される
mainブランチ → 本番、developブランチ → ステージング、といった運用が楽
環境変数もブランチごとに設定可能

Cloudflare Workers:

wrangler.tomlで環境を定義するだけ
wrangler deploy --env staging でステージング環境にデプロイ
D1やR2も環境ごとに分離できる

本番環境を壊す心配なく、安心して新機能をテストできます。個人開発でも、この安心感は大きいです。

各サービスの無料枠まとめ

全然使い切れないほど充実しています。

Vercel（フロントエンド）

リソース	無料枠
帯域幅	100 GB/月
Serverless Function	15万実行/月
ビルド時間	6,000分/月

Cloudflare Workers（バックエンド）

リソース	無料枠
リクエスト数	10万回/日
CPU時間	10ms/リクエスト

Cloudflare D1（データベース）

リソース	無料枠
ストレージ	5 GB
読み取り	500万行/日
書き込み	10万行/日

Cloudflare R2（ストレージ）

リソース	無料枠
ストレージ	10 GB
Class A操作	100万回/月
Class B操作	1,000万回/月
エグレス	無制限で無料

RunPod Serverless（AI推論）

GPU	Flex Worker料金
16GB GPU	$0.00016/s
24GB GPU	$0.00019/s
48GB GPU	$0.00034/s

※無料枠はありませんが、使った分だけの課金です。

開発中にハマったポイント

1. Cloudflare Workersの制限

問題: Workers内で大きなAI処理しようとしたら、メモリ制限（128MB）に引っかかった。

解決: AI処理はRunPod側に任せ、Workersはビジネスロジックと軽い画像処理のみに専念。処理の分離が重要でした。

2. RunPodのコールドスタート

問題: Flex Workerは初回リクエスト時にコンテナを起動するため、10-30秒の遅延が発生。

対処:

ユーザーには「処理中」のUIを見せて待ってもらう
どうしても遅延が許容できない場合はActive Workerを検討（高い！）
実際には、証明写真という用途では30秒待つのは許容範囲内でした

学んだこと

1. 処理の重さで分離する

AI推論（重い）とビジネスロジック（軽い）を同じサーバーに置くと、コスト最適化ができません。

重い処理 → GPU Serverless（使った分だけ課金）
軽い処理 → エッジServerless（無料枠で十分）

2. 固定費を避ける

個人開発では「誰も使わないかもしれない」というリスクがあります。Serverlessなら、使われなければ課金されない。これは精神面でとても大事です。

3. エコシステムを活用する

Cloudflareを選んだら、D1・R2・Workersを組み合わせる。同一エコシステム内での連携は楽です。

4. CI/CDは大事

VercelとCloudflare WorkersはどちらもGitHubと連携でき、スムーズに新しいコードをデプロイできて楽です。

まとめ

個人開発でフルスタックアプリを作るなら、Serverless構成を強くおすすめします。

レイヤー	おすすめ構成
フロントエンド	Next.js + Vercel
バックエンド	Hono + Cloudflare Workers
データベース	Cloudflare D1
ストレージ	Cloudflare R2
AI推論	RunPod Serverless

この構成なら：

初期費用ほぼ0円でスタートできる
使った分だけの課金で安心
トラフィック増加時も自動スケール
サーバー管理の手間がない

「作ったサービスが流行るかわからない」という個人開発の不確実性に対して、Serverlessアーキテクチャは最適解だと思います。

質問があれば、コメントで気軽にどうぞ！

参考リンク