重要な情報
Autocodeは2024/4/26をもってサービス終了しています。
所有者がOpenAIへの参画をきっかけに終了させたとのこと。
※ソース
昨年からやりたいと思っていた同期でのアドベントカレンダーを立てることができ、嬉しく思います。参加したいと声をくださった方、ありがとうございます！
WebAPIのテストorそれ以外の記事を書くという予告どおり、それ以外の記事を書きました。
webAPIテストは内容が自分にとって高度すぎた
本記事のまとめ
・プログラム初心者でも色んなものを作れるローコード開発環境、Autocodeを使った感想
・作ったものは、Discordに入力されたテキストをNotionに転送できるDiscord bot
(そのモチベーションは後述)。
・Autocodeのおかげで、開発の素人な自分でもjavascriptを書き、APIを叩けました！
Autocodeとは何か
・自動化ソフトウェアの1つ。何度もやる反復タスクを自動化できます。
より詳細には、コードを書き、それをHTTPリクエストやSaaSのイベントをトリガとして走らせることができます。その中で、APIを使いたいときにカンタンにAPIに接続できます。
・※そもそもAPI(Application Programming Interface)とは
Interfaceの一種です。イメージとしては、自分が所有してないアプリを借りて使う時に呪文。
(例。googleの検索窓に「カレー」と入力したら、検索結果が返ってきます。しかし検索を行うアプリはクライアントにありません。検索をするのは、googleというApplicationであり、遠方のgoogleのサーバーにあるProgramです。その自分の手元にないプログラムに対し、自分からどうやって検索キーワードを送りますか？どうやって検索してくれと命令しますか？その方法の1つがAPIです。)
・Autocodeの使用例
slackのコマンドをslackで入力したら、chatGPTのAPIに接続してslackで使う
というプログラムを実装できる。
↓
Autocodeから使えるAPIは多岐にわたる。gmail, google spreadsheetなど。
しかも、他の人が作成したコードはオープンソースとして公開されています。
Autocode内では"template"と"snippets"と呼ばれます。
上記のslackでchatGPTで使うコードもtemplateの一つです。
それらは開発時に流用したり、参考にしたりできます。
その他Autocodeには、API使用時の認証の管理などの機能があります。
実際にAutocodeでやったこと
モチベーション
ある日、discordに入力したテキストをnotionに転送する仕組みがほしくなりました。
前提知識
※Discordとは、teamsのようなコミュニケーション用のアプリです。
ただし用途は仕事ではなく、ゲーマーがゲーム用チャットに使うなどです。要は遊び向けです。
Notionとは、情報管理用のアプリです。例えば、メモ、タスク管理、データベース作成ができます。
作ったものの仕様を理解しやすいよう、開発のモチベーションを最初に説明します。
なぜdiscord→notionにテキストを送るbotを作りたかったか。
日頃、考えたことや失敗から学んだ反省をどこかに蓄積したいと思ってました。特に失敗は繰り返したくないものですから。
そこで、Notionに蓄積しようと思いました。これならメモを検索しやすく、後からデータも加工しやすそうだったので。
しかし、自分は面倒がりでした。
Notionというアプリを開くのが面倒すぎて、記入できないのでした。
一方、意図せず開けてしまうほどなじんだアプリもありました。
1つはDiscordでした。学生時代、友人と夜通しdiscordで会話するなどの廃人プレイをしてました。
みなさんも、無意識に開いちゃうアプリってありませんか
なので、Notionを開くよう自分を矯正するのは諦め、
馴染みのあるDiscordに気づきをメモり、
Notionに転送する仕組みを
実装することにしました。
要件
Discordに入力した5項目のテキストをNotionのデータベースに追加する。
※項目は以下。
What Went Well Today?
Best practices worth continuing out of this
What could have been better?
Lessons learnt worth stopping or modifying
Ideas/ suggestions improving if any
完成品
Discord画面
www, bp, chb, ...は上記の各項目の入力フィールド。項目の頭文字をとりました。
↓
Notion画面
データベースに自動で転送されました。
どうやって作ったか
コードの中心部分
こちらに沿って作りました。
ありがとうございました。
究極のローコード開発環境「Autocode」でNotionと連携するDiscordボットを開発してみた！
※このページの説明の注意点
2023年11月現在、notionとAPI連携をする際の方法が、上のページで紹介されている方法と異なります。
詳細はこちら
以下の画像のとおり、Autocodeが自動でコードを提案してくれます。
ポチポチするだけでコードが生成されます。
Discord側での入力フィールドを作る際も、AutocodeのツールDiscord Slash Command Builderを使用。カンタン。
カスタマイズした点
- 上記の参考ページと異なり、入力フィールドを1つ→5つに変更
- 入力日をデータベース上に追加。自動で補完されるようにしました。
前者のコードはこちら。
//discord上で入力されたテキストを変数itemsに入れる
const items = context.params.event.data;
properties: {
//中略
//データベースに転送するデータを定義する。itemsから指定。
"What went well today?":{
"rich_text":[
{"text": {"content":items.options[0].value}}
]
},
"Best practices worth continuing out of this":{
"rich_text":[
{"text": {"content":items.options[1].value}}
]
},
"What could have been better?":{
"rich_text":[
{"text":{"content":items.options[2].value}}
]
},
//以下同様
}
Autocodeの良さ
素人でも開発しやすいUI
javascriptの書き方やAPIについて何もわからなかったけど、動くソフトウェアを作れてしまいました。もちろん参考サイトのおかげもありますが、わかりやすいUIにより迷わず作れたと思います。
Pearl君(AIチャットボット)がプログラミングをサポート
AutocodeにはアドバイスをくれるAIチャットボット(Pearl君)がいました
例えば、21行目にエラー表示が出てるけどどう直せばいい？
と聞いたら「こう書いたらいいよ！！」コードを教えてくれました。
ただし利用制限があります。(1か月あたり質問は5回まで)
それを超えると課金が必要です。
Discord bot用のテンプレート
Discordのテンプレートがいくつかあります。
次はAI chatbotを作ってみたいです。
さいごに：開発の仕事をしていなくてもハンズオンには効果がありそう
仕事ではテスト実装をしています。テストケースとテストデータの作成です。テストポイントはAPIがちゃんと動くかなどです。なので、APIの設計書を読み続けています。ですが、正直着眼点が分かりませんでした。
そもそも設計書はどういう役割があるのでしょうか。それは
(日常の言語から)業務分析/要件定義--->設計書--->プログラミング(コンピュータの言語へ)
つまり、実生活や業務の世界の表現をプログラミングの世界の表現に翻訳する際の、
中間の表現だそう。
今回は後半のプログラムに触れる経験ができて、設計書の個々の要素の意味を想像しやすくなりました。
勉強目的もありましたが、
なにより自分の生活をよくする何かを自分で作れるのは非常に楽しく、満足でした。
最後までお読みいただきありがとうございました！
アドベントカレンダーなので、楽しい年末を！~~
補足：Notionの用語
開発時にデータの構造の用語で混乱したので参考兼備忘録として記載
・ページ
記録する時の単位。記録はこのページ単位で区切られる。
ページはタイトルを持つ。
・ブロック
Notionの場合、記録の単位は階層構造を持つ。ブロックはページの下位に属する単位、子ども。
例：テキスト、todoリスト、引用
さらに、ブロックとして子ページを選ぶこともできる。
・データベース
見た目は表だが、ただのExcelではない。Notionにおける構成要素は以下の通り。
1つのページの中に、データベースが属している。
1つのデータベースの中に、1つのタイトルが属している(上部に表示される太字のやつ)。
そして見た目通り、1つのデータベースの中に、複数の行が属している。
この1行は、実は1つのページ! それゆえ、データベースの1行の中に、タイトルと空欄が属している。加えて、空欄とは別にプロパティも属している。
参考サイトはこちら