Reactで小規模SaaSを作る
画面、認証、データ保存、公開までをReact系の定番構成で揃えます。
代表的な構成
唯一の正解ではなく、理解しやすい出発点です。
- 01
JavaScriptへ静的な型検査を加えるプログラミング言語。
- 02
状態に応じた画面をコンポーネントで組み立てるUIライブラリ。
- 03
Reactを基盤にフルスタックWebアプリを作るフレームワーク。
- 04
標準SQLと拡張性に強いオープンソースリレーショナル DB。
- 05
型付きクライアントとスキーマを中心にDBを扱うTypeScript ORM。
- 06
Web フレームワーク向けのオープンソース認証ライブラリ。
- 07
フロントエンドとNext.jsの公開ワークフローに強いクラウドプラットフォーム。
なぜこの構成？
- Next.jsで公開ページとログイン後の画面を一つのプロジェクトに置ける。
- PostgreSQLとPrismaで、関係を持つ業務データを型付きで操作できる。
- Auth.jsを使うと、複数の認証方法をアプリへ組み込みやすい。
向かない場面
- 画面がほぼ静的なら、Reactを全面的に使う構成は配信量が増えやすい。
- フレームワークの機能へ寄せるほど、実行環境を替える際の確認事項が増える。
別ルートもある
- Vueを採用するチームなら、Nuxtと同等のデータ構成を組み合わせる。
- Cloudflare内で完結させるなら、HonoとD1から小さく始める。