0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Google AI Studioとは

Google AI Studioとは、バイブコーディングでWebアプリケーションを開発できるサービスです。
チャットから作りたいものを指示すると良しなに開発してくれます。
出来上がったWebアプリはPublishするとGoogle CloudのCloud Runにデプロイされて公開できます。

プレビュー状態のWebアプリを作るだけなら無料で使えるので気になる方は触ってみてください。

Cloud SQLとの連携機能がGA

2026/6/18にCloud SQL for PostgreSQLとの連携機能がGAになりました。

これにより、Google AI StudioでCloud SQLにアクセスするWebアプリを作れるようになりました。
RDBMSにデータを永続化したいケースでも利用できるようになったので幅が広がりましたね。

Cloud SQLを使ったWebアプリを作ってみる

以下の記事で作ったドキュメントをインプットに作ってもらいます。

Custom instructionsでアップロードする各種ドキュメントの説明を記載して読み方を伝えるようにしました。
なお、各ドキュメントの説明はAntigravity CLIに作ってもらいました。

image.png

image.png

こんな感じで以前の記事でAntigravity CLIが作ってくれたドキュメントを丸っとアップロードしてあります。
プロンプトではCloud SQLを使うよう明示的に指示をします。

image.png

生成中は画面左側に入力したプロンプトやファイル、進行状況が表示されます。
添付したファイルはクリックすると以下のように中身をプレビューできます。

image.png

しばらく待つとサイトデザインをどうするか聞かれました。
とりあえず一番最初に表示されたダークな感じのデザイン(Frosted Glass)を選んで進めます。

image.png

またしばらくするとCloud SQLを有効化するか確認のカードが表示されました。
Enable Cloud SQLをクリックして進めます。

image.png

画面中央上部のCodeのトグルスイッチを押すとソースコードが生成されていく様子を眺めることができます。

image.png

エラーによる自動中断とリトライを何度か繰り返したのち、1時間程度でWebアプリが完成しました。
画面中央上部のPreviewのトグルスイッチを押すと出来上がったWebアプリを触ってみることができます。

あれ、全然ダークなデザインじゃないですね笑
ドキュメントに記載された内容(育児を題材としたプロダクトである旨)を優先した結果かもしれません。

image.png

画像がどこかから持ってこられたもののようなので隠してあります。

Antigravity CLIで作ってもらった時と異なり、Googleアカウントでログインできる仕様になっていました。
そして、実際にGoogleアカウントでログインできました。

image.png

ログイン後には育児用品に対してレビューコメントをかけるようになっていました。
ちゃんと認可制御できているようです。

image.png

レビューコメントを登録するとちゃんと表示されました。

image.png

Google CloudコンソールからCloud SQLを見てみるとインスタンスができています。
Google AI Studioで管理されており、直接の編集は制限されていると表示されています。
Studioが非表示になっているので直接SQLでデータを見ることはできないようです。

image.png

Google AI Studioの画面右上からPublishをしてみます。

image.png

PublishをするとCloud Runにデプロイされます。
しかし、デプロイはしたものの起動に失敗しているようです。

image.png

Google AI StudioのCodeを見るとDockerfileがありませんでした。
通常はDockerfileなしでもデプロイできると思いますが、今回は問題解消のために明示的に作成を指示してみます。

image.png

その後改めてRepublishをすると今度は無事成功しました。

image.png

表示されたURLにアクセスすると出来上がったWebアプリにアクセスできました。

画像に加え、商品名も隠してあります。実在の商品名がサンプルデータとして生成されていました。

image.png

サービスを停止する

Google AI Studio画面右上のPublishからUnpublishを実行します。
これによりCloud Runが削除されました。

image.png

ただし、Cloud SQLはこのタイミングでは削除されませんでした。
Google AI Studio上のプレビュー状態でもデータはCloud SQLに永続化をしているための様です。

作成されるCloud SQLはスターターティアなので基本的には無料ですが、意図せず残り続けることで将来的に課金されるリスクもあり得ます。
Webアプリ開発をやめる場合は後述する手順でアプリの削除までやることをお勧めします。

Google AI Studioからアプリを削除する

Google AI StudioトップページのMyAppsから、作成したアプリを削除できます。
これによりCloud SQLインスタンスも削除されました。

image.png

まとめ

非エンジニアによるWebサービス開発

今回はGoogle AI StudioでCloud SQLを使ったWebアプリを作りました。
エンジニアじゃなくてもデータの永続化が必要なWebサービスを作りやすい時代になったなと素直に思いました。
一方、Dockerfile作成の対処個所はCloud Runについて知らないと対処が難しかっただろうと思います。
ただし、この問題は一時的なもので、今後使われていけば徐々に改善されていくだろうと思います。

Antigravity CLIで開発したときとの比較

出来上がったWebアプリはAntigravity CLIで作ったときとほとんど同じでした。
同じドキュメントをインプットに生成したためだと思いますが、ここまで同じだとは正直びっくりしました。

Cloud Runへのデプロイの問題は、Antigravity CLIで作ったときには問題が起きませんでした。
Antigravity CLIの方がGoogle Cloud上の問題解決能力が高いのかもしれません。
また、今回は合計で2時間程度生成にかかったことを考えるとAntigravity CLIの方がかなり速いと思います。

一方、Google AI StudioはCloud SQLを無料で利用開始できるため、サービス開始時のクラウド利用料を低減できるメリットがあります。
また、Google AI Studio上のみでインフラの管理もできる(というかStudioからしかできない)ため、サービスの管理負荷を抑えられそうに感じました。

利用者が増えて規模が拡大してくると厳しいかもしれませんが、ニッチな領域で手軽にサービス展開したい場合にはマッチしそうに思います。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?