フロントエンドエンジニアでもできる!Supabaseを活用したスタートアップの実例
株式会社Berry / Takashi Asanuma
EM / フルスタックエンジニア
利用プラン | 利用機能 | ツールの利用規模 | ツールの利用開始時期 | 事業形態 |
---|---|---|---|---|
TEAM | Auth, DB, Storage, Edge Function(Baas全般) | 10名以下 | 2021年7月 | B to B |
利用プラン | TEAM |
---|---|
利用機能 | Auth, DB, Storage, Edge Function(Baas全般) |
ツールの利用規模 | 10名以下 |
ツールの利用開始時期 | 2021年7月 |
事業形態 | B to B |
アーキテクチャ
アーキテクチャの意図・工夫
フロントエンドの技術・開発にフォーカスできることを目指したアーキテクチャにしています。
ポイントは、
- 開発言語は、TypeScriptのみに絞り込めること
- プラットフォーム知識は、Supabaseに注力できること
- サーバ、インフラのリソースを持たずに済むこと
に尽きます。特に、サーバ・インフラのリソースを持たないことは、運用を中心に相当量の負担、及び、リスク軽減につながっています。
導入の背景・解決したかった問題
導入背景
ツール導入前の課題
2021年の起業当初、システムエンジニアは一人、かつ、フロントエンド経験のみだったため、バックエンド・インフラの経験・知識が不足していました。そのため、Webアプリケーションをフロントエンド経験のみで実現し、開発・運用する必要がありました。
どのような状態を目指していたか
起業と同時にBerryのWebアプリケーションが必要だったので、とにかく一人でも開発・運用に持っていける状態を目指しました。バックエンド的なことはプラットフォームに頼り、必要となる機能開発に集中できる状態を必要としました。
比較検討したサービス
- Firebase
選定理由
FirebaseのNoSQLよりも、Supabaseが採用しているPostgresのRDB構成のほうが、データ構造を直感的に開発しやすかった点がポイントです。
導入の成果
改善したかった課題はどれくらい解決されたか
実際に一人のシステムエンジニアでサービスをリリースし、3年間の間でプラットフォームについて技術的な壁に当たることもなく、順調に事業成長と共にスケール・運用できています。
どのような成果が得られたか
スタートアップ当初の状態でも目指すWebアプリケーションを提供開始でき、3年経過した現在でも安定稼働とスケールを両立できています。特に、チームもフロントエンド中心の技術メンバーのみで組織できていることも成果として大きいと捉えています。
導入に向けた社内への説明
上長・チームへの説明
スタートアップの起業フェーズでの導入だったので・・・特に説明やフィードバックということもなかったです(笑)Supabaseも2020年にスタートしたばかりの時期だったのですが、フロントエンド技術との相性の良さで、即導入に至りました。
活用方法
よく使う機能
Row Level Security(RLS) Supabaseをプロダクションで利用するためには、RLSは必須の機能・設定です。Auth機能と連携し、データベースのレコードレベルで権限設定を行っています。RLSの設定を検証するテストは、TypeScript(Vitest)を使って行い、CIも実施しています。
supabase-jsと公式ドキュメント フロントエンドからSupabaseの機能を利用するためには、supabase-jsのクライアントライブラリを必ず使用しています。公式ドキュメントと合わせて、Supabaseの機能を最大限に活用するために不可欠です。間違いなく、Auth関連の必要な機能はドキュメントを調べることで見つかります。
supabase-cli ローカル開発環境で絶対に使って欲しい機能です。supabase-cliを使用することで、ローカルにSupabaseプラットフォームを動かすことができます。ローカル開発環境のセットアップ、データベースのマイグレーション、自動テスト、GitHubへのプルリクエスト後のCI実行など、開発フローに欠かせない機能・ツールだと思っています。
ツールの良い点
- DashBoardが使いやすく、機能も充実している
- supabase-cliを使った開発体験が快適、簡単
- Point in timeでリカバリーもできる
- Branchingなど面白い機能のリリースが盛ん
- ちょっとした困りごとでも反応してくれたり、サポートの対応も早い
ツールの課題点
- 運用中のRLS変更はちょっと怖いので、検証方法が必要
- supabase-cliを使いこなすキャッチアップ(Migrationなどは、フロントエンド経験のみだと手間取るかも)
- バージョンアップも盛んなので、本番・開発などのこまめなバージョン確認と追従
ツールを検討されている方へ
ここまでのレビューは、私達が起業したばかりのころから約3年、プロダクトのプラットフォームにSupabaseを採用して得たことをそのまま記載させていただきました。フロントエンド技術のみ、かつ、少人数で続けている点は、これから起業やWebサービスの立ち上げを考えている方に参考になればと思っています。Supabaseの採用とキャッチアップにより、フロントエンドのみでもフルスタックな開発とサービスローンチを行うことができています。採用技術の範囲を絞り込めている点を参考にしていただければと思います。
今後の展望
同一アプリケーションで複数リージョンに展開するケースを考えてみたいです。プロジェクトで分けて用意していくか、レプリカ構成でマルチリージョンにしてみるか、試したいことの一つです。また、Branching機能も検証してみたい機能です。開発ブランチに合わせてSupabaseもブランチを作ることができれば、Vercelからの確認も捗ることが期待されます。
株式会社Berry / Takashi Asanuma
EM / フルスタックエンジニア
よく見られているレビュー
株式会社Berry / Takashi Asanuma
EM / フルスタックエンジニア
レビューしているツール
目次
- アーキテクチャ
- 導入の背景・解決したかった問題
- 活用方法