今週は、Vibe codingでアプリを立ち上げることができるFirebase Studioの紹介。最近ローンチされたばかりのこのサービス。
実は、Vibe coding系サービスでも最もポピュラーなものになるポテンシャルがあると思っています。
ポッドキャストでは、具体的なアプリを作る流れ、仕様について実演を交えながら解説しました。
Takeaways
Firebase Studioは、Google関連のサービスの連携がシームレスで無料で3つまでのアプリをコーディングなしでリリースすることができる。
LavableやReplitなどの競合サービスがすでにあるが、Firebase Studioがこれらサービスを凌駕して市場を獲得する可能性は十分にある。理由はデータベースや費用の管理、デプロイ環境のロックイン回避など柔軟性と利便性に起因する。
しかし、複雑なアプリを即時に作ることは難しく、シンプルなものに限定される。使いこなすには正式版のリリース、使用経験を経る必要があるという感想。
いずれにしても、アプリ開発AIエージェントの選択肢として有力な候補が誕生したことになる。
Transcript
00:00:27 ～ 00:02:03
【サービス概要・バイブコーディングの背景】
Fire Studioは無料でフルスタック開発が可能で、簡単にアプリを立ち上げられる点が注目を集めている。
従来のFirebaseにフロントエンドやGeminiなどを統合し、プロンプト入力だけでアプリを生成できる。
プレビュー期間中は無料で3つまでアプリが作れる。
例として、レシピジェネレーターなどのサンプルアプリを試してみる流れを紹介。
00:02:04 ～ 00:05:28
【サンプルアプリ作成・プロトタイプ化】
レシピジェネレーターのプロンプトを実行し、アプリが自動生成される様子を紹介。
「バタフライEメールクライアント」のプロトタイプ作成を試すも、複雑な機能要求ではログイン画面までしか生成されなかった事例に言及。
GeminiのAPIキーを入力する必要があり、一旦画面共有を停止して設定を行う様子を説明。
プロトタイプ化が終わると、フロントエンドがほぼ完成状態で提示される手軽さが強調される。
00:05:29 ～ 00:08:55
【レシピジェネレーター動作確認】
材料を入力すると、GeminiのAPIがレシピを自動生成。
「鶏肉と野菜のミルク煮」など具体的なレシピが返されるのを実演。
Publishボタンを押すだけでFirebase上にホスティングできる手軽さを紹介。
その一方で日本語入力はできても、出力が英語になるケースがあるなどの言及もあり。
00:08:56 ～ 00:11:55
【デプロイとホスティング・他サービスとの比較】
ボタン操作と課金情報の設定のみでアプリをすぐに公開可能。
VercelやReplit、さらには「ラバブル（Bubble）」などの類似サービスとの比較。
GoogleがGeminiやFirebaseと自動連携してくれるメリットは大きく、今後の競合サービスへの影響を推測。
Firebase Studioでの公開や課金システムの設定が非常にシンプルである点を強調。
00:11:56 ～ 00:14:25
【ロックインの懸念と回避策】
Firebase Studio専用の環境にロックインされる懸念があったが、実際はオンプレミスや他クラウドへのデプロイ手段も用意されている。
プレビュー期間中は無料で3つの開発ワークスペースを作成可能（Google Developer Program参加者は最大30個）。
Google Cloudのフリークレジットも利用できる場合があり、コスト面のハードルは低め。
00:14:26 ～ 00:17:37
【コードエディタ機能・カラー変更の試行】
ブラウザ上の「エディットコード」から、AI支援のコードエディタを使い修正を行う様子。
全体のイメージカラーをブルーにしたいが、思ったように反映されず。
Tailwind CSSかどこかの定義を具体的に指定する必要性など、詳細設定の難しさを指摘。
AIに「いい感じに変えてほしい」と曖昧に頼むだけでは対応が難しい。
00:17:38 ～ 00:19:22
【総括・クロージング】
生成AIで作ったコードを自分でアレンジできる仕組みは有用。
Fire Studioならサーバー設定や費用管理もスムーズで、Stripe等のAPIを組み合わせ課金付きアプリを公開できる可能性が高い。
Share this post