Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
OpenAI APIを使ったGlideでのWebアプリづくり
Search
なんや
May 10, 2023
Programming
0
980
OpenAI APIを使ったGlideでのWebアプリづくり
なんや
May 10, 2023
Tweet
Share
More Decks by なんや
See All by なんや
ノーコードでのWebアプリの作り方
nanya3737
0
360
Other Decks in Programming
See All in Programming
AWS CDKの推しポイントN選
akihisaikeda
1
240
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
panda728
PRO
38
25k
Microservices rules: What good looks like
cer
PRO
0
1.3k
LLM Çağında Backend Olmak: 10 Milyon Prompt'u Milisaniyede Sorgulamak
selcukusta
0
120
Socio-Technical Evolution: Growing an Architecture and Its Organization for Fast Flow
cer
PRO
0
330
令和最新版Android Studioで化石デバイス向けアプリを作る
arkw
0
390
手が足りない!兼業データエンジニアに必要だったアーキテクチャと立ち回り
zinkosuke
0
630
UIデザインに役立つ 2025年の最新CSS / The Latest CSS for UI Design 2025
clockmaker
18
7.4k
配送計画の均等化機能を提供する取り組みについて(⽩⾦鉱業 Meetup Vol.21@六本⽊(数理最適化編))
izu_nori
0
150
なあ兄弟、 余白の意味を考えてから UI実装してくれ!
ktcryomm
11
11k
dnx で実行できるコマンド、作ってみました
tomohisa
0
150
WebRTC と Rust と8K 60fps
tnoho
2
2k
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
340
57k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.3k
Designing Experiences People Love
moore
143
24k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.3k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
122
21k
Optimizing for Happiness
mojombo
379
70k
Bash Introduction
62gerente
615
210k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
Mobile First: as difficult as doing things right
swwweet
225
10k
A designer walks into a library…
pauljervisheath
210
24k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Transcript
OpenAI APIを使ったGlideでのWebアプリづくり @nanya3737 2023.5.11
本日の内容 2 ・自己紹介 ・ChatGPTハッカソンへの参加 #Protopedia ・ノーコードツールGlideを使ったWebアプリ開発 ・まとめ
自己紹介 3 名前: なんや @nanya3737 業務: データ分析業務 - 機械学習による異常検知 - IoTデータを活用した新サービス検討 など
普段のChatGPTの活用: - データ分析でのPythonコード出力 - Kaggle での可視化/モデリング etc. 動機: 業務ではデータとにらめっこしているが、アプリを作りたい。 フロントエンドはガッツリではなく、簡単に使えるノーコードで良い。
4 https://mashupawards.connpass.com/event/278641/ 一週間で開発するハッカソン
5 https://protopedia.net/
6 (有名人) っぽい回答をしてくれるジェネレーター https://poiai.glide.page っぽいAI GENERATOR
ノーコードツールでの開発 7 ・プログラミング不要でWebアプリ開発が可能 ・Google Spread Sheet と連携して開発 (読み書き) ・OpenAI APIのコネクタも準備されている
※ただしちょっと注意事項あり っぽいAI GENERATOR
GlideでのOpenAIのコネクタ 8 ・GLIDEではアクションとして、 ボタンを押すと動作する内容を設定できる。 ・OpenAI のAPIコネクタもbeta版で 用意されており、プロンプト (質問文)を APIで簡単に投げることが可能 ※ただし、現状古いモデルの
text-davinci-003 しか使えない。gpt-3.5-turbo も今後使える ようになるはず。 っぽいAI GENERATOR
構成概要 9 回答精度の関係上、gpt-3.5 を使いたかったので、今回はGASを間に挟んで作成。 Google Spread Sheet Google Apps Script
OpenAI API UI データ 問い合わせ API っぽいAI GENERATOR (Google Apps Script)
やってみた感想 10 ・今回はギャグアプリだが、テーマを変えれば、 利用者間で情報を共有しながら、ちょっとした Webアプリが作れそう (料理レシピ問い合わせアプリ、応援してほしい言葉を返すアプリ、 etc.) ・バックエンド中心の方は、ノーコードツールを使えば、 UI画面を簡単に作れたりするのは便利。 ・プロンプトエンジニアリングとして、
どのような質問文にすると狙った回答を得られるのか、 API問い合わせの工夫は多少必要。 っぽいAI GENERATOR
まとめ 11 ・Protopedia に面白いプロトタイプが掲載されている ・ノーコードツールGlideでUIを簡単に作れる ・GlideにはOpenAIのコネクタあり ・精度が高いモデルを利用したい場合は、 GASなどの別手段を考えても良い https://protopedia.net/prototype/3800 っぽいAI
GENERATOR
Fin. 12