ホームメンバー問い合わせ

【ノーコード入門】Makeでなんとかやってみる(最終号=5):APIで取得したデータをGoogle Spreadsheetに書き込む

By monco
Published in 博士の視点
November 05, 2023
【ノーコード入門】Makeでなんとかやってみる(最終号=5):APIで取得したデータをGoogle Spreadsheetに書き込む

前回のあらすじ

前回は中小企業庁が提供する「官公需情報ポータルサイト」が提供するAPI「官公需情報ポータルサイト検索API(以下、官公需APIとします)」に対して、ノーコードツール「Make」からアクセスして、データが取得できるところまで確認しました。 今回はそのデータをGoogle Spreadsheetに書き込んでいきます。今回でついに完結です!

Google Spreadsheetの準備

今回は、前回取得したデータ10件のタイトル( ProjectName )、登録日付( Date )、概要( ProjectDescription )を Google Spreadsheetに一覧として書き出したいと思います。Google Spreadsheetは、ブラウザ上で使えるExcelのようなものです。Googleのアカウントを持っていれば誰でも使えますので、知らない方は今回を機に試してみてください。

まずは書き出す準備をしますのでGoogleにログインした状態で、

https://docs.google.com/spreadsheets/u/0/

にアクセスしてください。下記のような画面が出てきますので、「空白」をクリックしてください。

空白をクリック
空白をクリック
そうするとおなじみの画面が出てきます。ここでは、このスプレッドシートの名前だけを変更します。「無題のスプレッドシート」をクリックすると名前を変更できます。
名前を変更
名前を変更
ここでは「入札情報」と入力しておきます。また、A列の一番上に「タイトル」、B列に「対象」、C列に「概要」と記載しておきます。
名前は何でも大丈夫です
名前は何でも大丈夫です
いったん、ここではこれでスプレッドシートでの作業は終わりです。

MakeからSpreadsheetに書き込む

makeに戻ります。makeにはGoogle Spreadsheetにアクセスできるブロックも用意されています。先程作ったHTTPのブロックの右の出っ張りにマウスのカーソルを乗っけると、「+」のボタンが出てきます。これで、Google Spreadsheetにアクセスするためのブロックをつなぎます。

+をクリック
+をクリック
「+」を押すと、先程同様に大きな「+」マークが現れますので、虫眼鏡マークのところに「google sheets」と入力します。「Google Sheets」というのをクリックします。
Google Sheetsをクリック
Google Sheetsをクリック
「Add a Row」を押します。これは、Google Spreadsheetに1行追加するという機能を持つブロックとなります。
Add a Rowをクリック
Add a Rowをクリック
自動的に設定画面が表示されます。まずはmakeと自分のGoogleアカウントを連携する必要があります。Connectionの横にある「Add」を押すと、「Create a connection」というメニューが表示されるので、その右下の「Sign in with Google」をクリックします。自分のGoogleとの連携画面が出ますので、ご自身のGoogleのユーザー名やパスワードなどを入力して、連携を完了してください。
Googleとの連携画面
Googleとの連携画面
連携が成功すると「Connection」に「My Google connection」と表示されます。次に、「Spreadsheet ID」の「Click here tor choose file」をクリックします。
Click here tor choose fileをクリック
Click here tor choose fileをクリック
そうすると、ご自身のGoogle Spreadsheetの一覧が表示されますので、虫眼鏡マークのところに先程作った「入札情報」を選択します。
入札情報を選択
入札情報を選択
その後、シート内のどこにどのような内容を書き込むかを指定します。

  • Sheet Nameは「シート1」(これは、スプレッドシートのどのシートに記載するかを指定します)
  • Table contains headersは「Yes」(1行目にタイトルがあるかどうかを指定します。今回は「タイトル」など、1行目に記載したのでYesにしておきます。
    Google Sheetへ書き込む情報を設定
    Google Sheetへ書き込む情報を設定
    ValuesのA〜Cには、APIから受信したどのデータを埋めるかを指定します。HTTPのブロックと正しく連携されていれば、APIのサンプルを見ながら設定できます。
  • A列には「Data」「Results」「SearchResults」配下の「ProjectName」
  • B列には「Data」「Results」「SearchResults」配下の「Date」
  • C列には「Data」「Results」「SearchResults」配下の「ProjectDescription」 を設定します。

これでいったん、先程と同じく保存をし、「Run once」を押してみましょう。HTTPとGoogle Sheetsの両方のブロックの上に「1」が出てこれば成功です。

Run onceを押して実行
Run onceを押して実行
先程作ったGoogle Spreadsheetを見てみましょう。
Google Spreadsheetを確認
Google Spreadsheetを確認
20件あったのに、1行しか書かれていません。これは、HTTPが受信したデータ10件がいっぺんに次のブロックに送られているためです。

複数受け取ったデータをバラバラにする

10件を全て書くには、この10件のかたまりをバラバラにして、1行ずつGoogle Sheetsのブロックに送る必要があります。嬉しいことに、このバラバラにする機能を持つブロックもあります。

バラバラにするためのブロック
バラバラにするためのブロック
画面下の歯車のようなアイコン「TOOLS」をクリックし、「Iterator」を選択します。そうすると、Iteratorという大きなアイコンが出てきます。
Iteratorを選択
Iteratorを選択
IteratorのブロックをHTTPとGoogle Sheetsの間にドラッグ&ドロップすると、2つのブロックの間にIteratorブロックが勝手に間に入ってくれます。
Iteratorをドラッグ&ドロップ
Iteratorをドラッグ&ドロップ
このようになれば成功です。Iteratorをクリックすると、設定画面が出てきます。「Array」をクリックすると、うまく連結されていればAPIが取得したデータの中身が表示されます。今回は、「items[]」が20件のデータが含まれている部分ですので、「Data」「Results」「SearchResults[]」配下の「SearchResult[]」をクリックし、その後「OK」を押します。
ちょっと複雑ですが、うまく行けばこうなります
ちょっと複雑ですが、うまく行けばこうなります
次に、Google Sheetsブロックをクリックします。先程設定したValuesをいったん削除したあと、今度は緑色の項目が選択できると思いますので、それぞれ「ProjectName」「Date」「ProjectDescription」それぞれの配下の「1」をクリックします。その後、「OK」をクリックします。
Google Sheetsブロックを再度設定
Google Sheetsブロックを再度設定
また、Google Spreadsheetに戻って、今あるレコードを消しておきます。
今あるレコード1行を消す
今あるレコード1行を消す
それではこの状態で先程と同じく保存および「Run once」をクリックしてみます。今度はGoogle Sheetsの吹き出しが1から10まで一つずつ増えていくのがわかると思います。Iteratorが10件のデータを一つずつ次のブロックに投げている証拠です。
Run onceを押して実行
Run onceを押して実行
吹き出しが「10」になったら、Google Spreadsheetを見てみましょう。10行追加されていると思います!
Google Spreadsheetで複数表示されていることを確認!
Google Spreadsheetで複数表示されていることを確認!
これで、APIから取得したデータをすべてGoogle Spreadsheetに書き込むことができました!

まとめ

5回にわたりノーコードツール「Make」とAPIの仕組みについて説明してきました。このように、サーバーがなくても、プログラムをしなくてもブロックを連結する感覚でアプリケーションを作れます。 すこしプログラム的な思考が必要なところもありますが、いくつか作っていくうちに慣れていくと思いますので、是非他のAPIにもチャレンジしてみてください!

サムライアプスでは、このようなサーバーレス&ノーコードツールを使ったアプリケーション開発を支援しています。もし、ご興味があれば、お気軽にお問い合わせください。

これにてご免!


Tags

ノーコード中小企業スタートアップMakeAPIテクノロジー解説

Share

Previous Article
【ノーコード入門】Makeでなんとかやってみる(4):MakeからAPIを呼び出す
monco

monco

デジタル化 サムライ

Table Of Contents

1
前回のあらすじ
2
Google Spreadsheetの準備
3
MakeからSpreadsheetに書き込む
4
複数受け取ったデータをバラバラにする
5
まとめ

Related Posts

【ノーコード入門】Makeでなんとかやってみる(4):MakeからAPIを呼び出す
November 04, 2023
© 2024, All Rights Reserved.
Powered By

コンテンツ

補助金・政策博士の視点アイデアの小槌

Social Media