ブラウザ上で実行され、 AIアシスタント付きデータベース postgres.new を触ってみた
by
sutetotanuki
×
Copy
Open
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Slide 1
Slide 1 text
ブラウザ上で実⾏され、 AIアシスタント付きデータベース postgres.new を触ってみた 1
Slide 2
Slide 2 text
2 postgres.new とは?
Slide 3
Slide 3 text
3 postgres.newとは? Supabaseが作成したブラウザ上で動作し AIアシスタントがついた PostgreSQL 主に以下のことができる ● スキーマの⾃動⽣成 ● ⾃然⾔語でSQLを使わずにクエリ ● ⾃然⾔語でグラフ⽣成 ● ⾃然⾔語でシードデータを投⼊
Slide 4
Slide 4 text
4 できること
Slide 5
Slide 5 text
5 URLにアクセスするだけで試せる https://postgres.new アクセスするだけでプレイグランドが使える アクセスしたブラウザ上でPostgreSQLが起動し ブラウザ上でデータを保存する
Slide 6
Slide 6 text
6 スキーマの⾃動⽣成 CSVをドラックドロップ するだけでスキーマが ⽣成される
Slide 7
Slide 7 text
7 スキーマの⾃動⽣成 CSVデータのヘッダとデータの特徴から 列名とデータ型を⾃動で定義 customer_id,first_name,last_name,email,phone_number 1,田中,太郎,
[email protected]
,090-1234-5678 2,佐藤,花子,
[email protected]
,080-2345-6789 3,鈴木,一郎,
[email protected]
,070-3456-7890 4,山田,美咲,
[email protected]
,090-4567-8901 5,伊藤,健太,
[email protected]
,080-5678-9012 サンプルCSV
Slide 8
Slide 8 text
8 スキーマの⾃動⽣成 複数の関連のあるCSV ファイルをアップロード するとその内容から リレーションを推測して くれる
Slide 9
Slide 9 text
9 ⾃然⾔語でSQL チャットから ⾃然⾔語でクエリできる 複数CSVの関連を理解し 関連を考慮したSQLを⽣成
Slide 10
Slide 10 text
10 ⾃然⾔語でSQL ⽣成したSQLを確認できる 関連を理解したjoin句が ⽣成されてる
Slide 11
Slide 11 text
11 ⾃然⾔語でグラフ⽣成 ⾃然⾔語でグラフ⽣成 ができる 依頼内容に応じて グラフの種類を使い分 けてくれる
Slide 12
Slide 12 text
12 ⾃然⾔語でデータ投⼊ チャットから⾃然⾔語で データを投⼊することで る
Slide 13
Slide 13 text
13 使ってみて
Slide 14
Slide 14 text
14 使ってみて ● チャットでエンターを押すと実⾏されてしま うので⽇本語で使いにくい(コピペで対応) ● グラフは2つ以上同時に⽣成できない ● ⽣成AIなので⽣成されるSQLも揺れがある。 例えばランキングでも昇順、降順の指定がな いとばらつく。明⽰的に指定する必要がある ● デフォルトでは limit 5 が必ずつく ○ 「全ての」とつけて回避
Slide 15
Slide 15 text
15 エラーの⾃動修正 エラーになった場合は ⾃動修正。修正できな い場合はサジェスト (画像はUTF-8でないと 取り込めないから icov 等使って直してと⾔わ れてる)
Slide 16
Slide 16 text
16 エラーの⾃動修正 エラーになった場合は ⾃動修正。修正できな い場合はサジェスト (画像はUTF-8でないと 取り込めないから icov 等使って直してと⾔わ れてる)
Slide 17
Slide 17 text
17 使えそうなユースケース ● 簡易な分析 ● 表計算ソフトを使って作成してたような グラフの作成を⾃然⾔語でサクッと作る ● ⾮エンジニアが複雑なクエリを⾃然⾔語で 実⾏する
Slide 18
Slide 18 text
18 使われてる技術要素
Slide 19
Slide 19 text
19 ブラウザ上で起動するPostgreSQL PGLite というライブラリを使っている WASM(Web Assembly)でビルドされ、 ブラウザ上で実⾏されるPostgreSQL データの永続化はIndexedDB等が使われる ブラウザでデータベース操作が完結し WebSocketなど使わずにPostgreSQLが使える
Slide 20
Slide 20 text
20 ⽣成AIのモデル gpt-4o-2024-08-06 が使われてる オープンソースになっていて 現時点のソースでは以下のリンクから プロンプトと⼀緒に使⽤してるモデルも確認で きる https://github.com/supabase-community/postgres-new/blob/main/apps/postgres-new/app/api/chat/route.ts#L63
Slide 21
Slide 21 text
21 ⽣成AIのフロントエンドへの組み込み VercelのAI SDKが使われている AI SDKは⽣成AIを使った機能を React や Vueに 組み込むためのフロントエンドライブラリ ChatのSSEを使ったリアルタイム制御や StreamingをこのSDKを使って実現
Slide 22
Slide 22 text
22 SQLやグラフデータの⽣成 グラフの描画にはChart.jsが使⽤されている が、グラフに渡すデータはAIから返却された レスポンスが渡される この処理はFunction Callingによって実現され ている
Slide 23
Slide 23 text
23 今後のロードマップ
Slide 24
Slide 24 text
24 ロードマップ ● S3に置いてどこからでもアクセスできる ● Wordなど出⼒形式の拡充 ● URLを共有することでデータベースを他の ユーザーと共有 ● OPFSサポート
Slide 25
Slide 25 text
25 まとめ
Slide 26
Slide 26 text
26 まとめ ● Supabaseからブラウザ上で起動しAIアシスタ ントがついた postgres.new が出ました ● ⾃然⾔語でクエリできたりグラフが作れる ● 技術的には PGLiteや GPT-4o が使われてる ● 今後ファイル同期、出⼒フォーマットの拡充 が予定されてる
Slide 27
Slide 27 text
マッハチーム 27 プロダクト開発の 「立ち上げ専門チーム」 です。 高速に、プロダクト開発 と、 顧客との信頼関係構築 を行うことを目指しています。
Slide 28
Slide 28 text
こんな希望が叶うかも 28 ・ モダンな技術でフルスタック開発に挑戦したい 2~3名のエンジニアで、フロントエンド、サーバーサイド、インフラの全てを担当できます ・ プリセールスから入りプロダクトの方向性を提案したい エンジニアがプリセールスも顧客折衝もガンガン進めていきます ・ 0から1を圧倒的なスピードで立ち上げたい ・2~6人月程度の案件サイズがボリュームゾーンです ・様々な業界・お客様のご支援を高速に回して、マッハで経験を獲得できます