はじめに
前回、こちらの記事でノーコードツールのAdaloを使って、TODOアプリを作りました。
今回は、Adaloで作ったアプリと、外部APIの連携を試してみます。
外部APIと接続するための設定
左のメニューバーの「Database」から「Connect to APIs」を選択
接続情報の設定
モーダルが立ち上がり、ここで接続情報を入力する。
今回は、猫様の情報を取得できるフリーのAPI、TheCatAPIを使います。
APIで取得したデータのモデル名(Cats)、APIのBasepath、その他必要な接続情報を入力します。
今回はHeaderにAPI keyをセットしたかったので、「ADD ITEM」を押下して、必要な情報を入力します。
エンドポイントの設定
次に進むと、エンドポイントの設定ができます。
今回はGet Allだけできればよかったので、特に設定しませんでしたが、URLを変更できたり、ResponseのKey項目を編集できそうでした。
接続確認
見事に失敗しました。APIのドキュメントとにらめっこして、basepathに/v1
が足りなかったので、修正してもう一度接続確認をします。
成功しました!
「CREATE COLLECTION」で設定完了です。
見た目(画面)を作る
前回の記事でも似たようなことをしているので、画面の作り方は省略します。
画面とデータをつなげる
こちらも前回の記事でやったのですが、ここはもう一度書いておきます。
画面の、猫様のデータを表示させたいリストをクリックして、色々設定していきます。
この画面で変えたところは以下のとおりです。
Listの名前: Brred List(タイポでBrred
になってます..)
What is the list of?: 先程作成したAPIと連携させたデータベース「Cats」を選択します
あとは、リストの各項目と、データベースの値を紐付けていきます。
ここで一つ驚きだったが、画像の項目を設定するときに、画像がなかったときのプレースホルダーも設定できました
便利...!
動作確認
動作確認のために、ノーマルスクリーンからホームスクリーンへ変更します。(ログイン後に最初に表示する画面にしたかっただけです)
ちょっとカクつくなーと思いましたが、手持ちのiPhoneで試したら問題なかったです。
Webのシュミレーターが少し重そうです。
おわりに
ここまで10分もかかりませんでした。
前回も書きましたが、10分で同じものをコードで作れと言われても私はできません。
このように、アイデアをクイックに動くものにできる(+色々気にしなければPublishもできる)というのは、本当にすごいことだと思います。
同時に、エンジニアの必要性についても深く考えさせられます。
コードが書けるだけのエンジニアはもう必要なくなってしまいますね。
[おまけ]Adaloで作ったデータベースにアクセスできるAPIを公開する
前回作ったTODOアプリのデータにアクセスできるAPIを公開することもできるようなので、やってみました。
Settingから、「Get Access To Your App's API Key」の下にある、「START INTEGRATION PACK TRIAL」を押下します。
なるほど。これは本来、有料プランの機能ですが、無料で14日間使えるということみたいです。
「VIEW ADALO API DOCUMENTATION」を押下すると、