対象

一般的なWebアプリケーション
特に、学生などはクレジットカードが使えずそもそも支払いができないという状況もあるので無料のものをまとめてみました。

結論として

• Supabase
• Next.js
• Drizzle
• Cloudflare Pages
• Cloudflare D1 / KV

どんな要素が必要か

Webアプリの開発に必要なのはフロントエンドと、バックエンドです。
バックエンドといっても、その中身は実際の処理に加え、DB、またログイン認証機構が必要になります。

フロントエンド

フロントエンドとしては、Next.js一強です。
すでにコミュニティも成熟しているので使いやすく、いろんなところに統合できます。

バックエンド処理

バックエンド処理は、Next.jsの"use server";を使えば簡単に行えるので、別にAPIを作ったりする必要はなさそうです。

フロント・バックエンドのデプロイ先

Next.jsのおかげでフロントもバックエンドも一つのCloudflare Pagesにまとめて投稿できます。
Cloudflare Pagesはよほどのことがない限り無料で、もちろんクレジットカードの登録もなしに使い始められるのでおすすめです。

DB

DBはSupabaseかCloudflare D1で迷いますが、Supabaseに比べCloudflare D1の制限が圧倒的に少ないので、Cloudflare D1がよいでしょう。
また、RDBでなくKVが使いたいときもCloudflare KVでなんとかなります。

DBのライブラリ

DBを扱うときはDrizzleというORMを使いましょう。
PrismaをCloudflare Pagesで何度も試しましたが、学習コストが高くエラーもたくさん出たのでDrizzleのほうが使いやすいと思います。

ログイン認証

ちょっと前まではCloudflareでMailChannels APIが完全無料無制限で使えたのですが、今は無理っぽいので素直にSupabase Authを使いましょう。
一応5万MAUまでは無料プランでクレジットカードなしで使えるので、アプリが収益化できる前くらいまでは何のためらいもなく使えます。