Gemini活用のアプリ開発ツール「Firebase Studio」はプログラミング初心者におすすめ！

Firebase Studioとは?

Google Cloudが新たに発表したFirebase Studioは、Googleの最新AIモデルであるGeminiと連携した基本無料のアプリ開発ツールです。プログラミング初心者でも扱いやすいように設計されている点が特徴です。

Firebase Studioでは、ユーザーがプロンプトを入力するだけで、GeminiはじめとするAIがアプリのUIやAPI、コードを自動的に生成します。アイデアを効率よく形にしたい開発者や、プログラミングの知識が少ないけれどアプリ開発に挑戦したいユーザーにとって、強い味方といえるでしょう。

Geminiを基盤に、複数のGoogleサービスを統合

Firebase StudioはGeminiをはじめ、複数のGoogleサービスを統合しています。

Firebase Studio

クラウドベースの統合開発環境を基盤に、アプリ開発プラットフォームやAIアシスタント、ワークフレームなどを統合することで、AIによるアプリ開発をワンストップで行うことができます。

作業ごとにワークスペースを分けたり、別々のツールを併用したりする必要がないため、これまで課題となっていた「アプリ開発の複雑さ」が大幅に軽減するでしょう。

Firebase Studioの料金

Firebase Studioは基本的に無料ですが、ワークスペース数によって支払いが発生することもあります。

• ユーザー1人あたり3つのワークスペースまで無料で利用可能
• ワークスペースの数を10に増やしたい場合、Google デベロッパー プログラムへの参加が必要
• ワークスペースを30に増やすには、有料のGoogle デベロッパー プレミアム プランへの登録が必要

また、Firebase Studioを使用してFirebaseプロジェクトを作成し、その請求先アカウントを紐づけた場合、以下のように料金が追加される点も念頭に置いておきましょう。

• Firebaseプロジェクトが、従量課金制の「Blaze プラン」に自動的にアップグレードされる
• Gemini APIの使用量が有料の階層にアップグレードされる
• 無料枠を超える有料サービスの使用量に対して課金される

Firebase Studioの機能と使い方

Firebase Studioの機能と使い方をステップごとに紹介します。

機能1．プロジェクトを新規作成・インポート

Firebase Studioでは、新しいプロジェクトを作成するほか、既存のプロジェクトをインポートまたはアップロードして作業を開始することができます。

既存のプロジェクトから始める場合は、「GitHub」「GitLab」「Bitbucket」などのバージョン管理システム、または圧縮ファイルからプロジェクトをインポートします。また、作業内容をGitHubに直接エクスポートすることも可能です。

インポートの手順は以下の通りです。

1. GoogleアカウントにログインしてFirebase Studioを開く
2. 「プロジェクトをインポート」をクリックすると、プロジェクトのインポートダイアログが表示される
3. 「リポジトリ URL」フィールドに、GitHub、GitLab、Bitbucketなどのリポジトリ URLを入力する
4. プロジェクトの名前を入力する
5. Flutterプロジェクトをインポートする場合は、「これはFlutterアプリです」を有効にする（そうでない場合はチェックボックスをオフのままにする）
6. 「インポート」をクリックする

機能2．テンプレートとサンプルを使用

新規・既存プロジェクトからではなく、テンプレートやサンプルを使用してプロジェクトを始めることもできます。

Firebase Studioは、60種類以上のテンプレートと、さまざまなサンプルアプリを用意しています。テンプレートでは以下のような幅広いプログラミング言語やフレームワークなどをサポートしています。

テンプレートやサンプルアプリを選択するだけで、スムーズにプロジェクトを始められるため、初心者でも気軽に挑戦できるでしょう。

機能3．プロトタイプを作成・公開

次に、AIエージェント「App Prototyping agent」でWebアプリのプロトタイプを作成します。

テキスト、画像、描画などでプロンプトを入力すると、App Prototyping agentが提案されたアプリ名、コア機能、スタイルガイドを含んだブループリント（設計データ）を作成します。

1. Google アカウントにログインし、Firebase Studioを開く
2. 「AIでアプリのプロトタイプを作成する」というフィールドにアプリのアイデアをテキストで入力する
   　　　※プロンプトにテキストだけでなく画像や描画ツールを使用することも可能
3. 「AIでプロトタイプを作成する」 をクリックする
4. ブループリントを確認して、必要に応じてGeminiに機能強化や変更をリクエストしてブループリントを編集する
5. ブループリントを承認したら「このアプリのプロトタイプを作成する」をクリックする

機能4．Geminiでコード・API生成

プロトタイプを作成した後は、GeminiでコードとAPIを生成します。

• 「このアプリのプロトタイプを作成する」をクリックする
• Geminiがブループリントからコードを生成し、確認用のWebプレビューを表示する
• アプリでAIを使用する場合は、Gemini API キーを追加または生成するよう求められる）
• 「自動生成」をクリックするとFirebaseプロジェクトと Gemini API キーが提供される

Geminiはコードとドキュメントの作成のほか、バグの修正や単体テストの作成と実行などの操作もサポートします。

機能5．アプリ公開前にテスト、公開後にモニタリング

Firebase StudioではブラウザでWebアプリをプレビューし、統合された複数のツールを使用してエミュレーション、テスト、デバッグを行います。

Firebase Studioには、以下のようなサービスが統合されています。

• Firebase Authentication：認証サービス
• Cloud Functions：サーバーレス フレームワーク
• Cloud Firestore：データベース
• Cloud Storage：クラウドストレージ
• Firebase App Hosting：ホスティングサービス

なおコード生成後は、テストや反復処理を実施して、アプリを公開する流れとなっています。

1. コード生成の完了後、アプリのプレビューを確認
2. 自然言語を使用してテストと反復処理を行う
3. コード内で直接デバッグと反復処理を行う
4. 「公開」をクリックしてFirebase App Hostingでアプリを公開する
5. アプリとAI機能をモニタリングして最適化する

アプリ公開後は、Firebase App Hostingでアプリのパフォーマンスと使用状況を、Genkitを通じて生成AIのフローをモニタリングできます。

機能6．オンライン開発環境をカスタマイズ

Firebase Studioは「Code OSS」プロジェクトをベースに構築されています。

システムパッケージ、言語ツール、IDE設定、アプリのプレビューなど、オンライン開発環境のほぼすべての面をカスタマイズすることが可能です。プロジェクトと開発環境全体の設定をカスタムテンプレートでチーム内で共有することもできます。

おわりに

ChatGPTが登場して以来、GeminiやMicrosoft 365 Copilotなど、さまざまなAIが登場し、こうしたAIを活用したツールも増えています。

こうした最先端のAI技術を知っておくことで、テクノロジーの変化が著しい近年でも活躍できるIT人材として重宝されるでしょう。もちろん、AIを使いこなすことで業務効率をぐんとアップできます。

インターネット・アカデミーの生成AIコースでは、ITの基礎知識から、AI、IoTといった最新トレンドの知識を正しく身につけることができます。またAIの知識に加え、アプリ開発に関する知識を身につけたい人はPython講座もおすすめです。

ぜひ気軽に無料カウンセリングでご相談ください。