enebular developer meetup 20220602

enebular developer meetup 20220602「気象庁天気 API を定期的に Airtable に記録＆自動化構築で思ったこと」の登壇資料です。

◆スライド内の素材は以下を使用させて頂いております。ありがとうございます！

・シルエットデザイン http://kage-design.com/
・human pictogram 2.0 http://pictogram2.com
・ICOOON MONO http://icooon-mono.com/
・Adobe Stock https://stock.adobe.com/jp

Transcript

1. enebular developer meetup 20220602
   気象庁天気 API を定期的に Airtable に
   記録＆自動化構築で思ったこと
   ワンフットシーバス 田中正吾
   

   View Slide

2. 私の話はスライドを後ほど共有します。
   話す内容に注力いただいて大丈夫です！
   

   View Slide

3. 田中正吾（たなかせいご）
   屋号：ワンフットシーバス
   2004年よりフリーランス。以後、FLASH制作を
   中心にインタラクティブコンテンツを主に行い現
   在に至る。
   最近ではWEBフロントエンドをベースにしなが
   らも、情報とインターフェースが合わさるアプ
   ローチという視点でIoTやMixed Realityといった
   技術も取り入れながら活動しています。
   

   View Slide

4. 今日お伝えすること
   enebular の実行環境ネタ
   

   View Slide

5. 気象庁天気 API を定期的に Airtable に記録
   

   View Slide

6. リアルタイムデモ
   とはいいつつ定期実行の1時間待つのはアレなので手実行します！
   

   View Slide

7. つくるときに試行錯誤したこと
   

   View Slide

8. 気象庁の天気予報 API
   

   View Slide

9. 公式提供ではないし内部データのJSONだけど
   政府標準利用規約に準拠して利用OKとのこと
   いままでの天気APIの利用の苦しさを考えればとてもありがたい！しっかり触りたかった。
   

   View Slide

10. 正直、仕様が私の力では把握しにくく
    ほしいデータを狙って取るJSON解析が大変め
    データ例だけど、ここに至るまでがまず苦労するやつ
    https://www.jma.go.jp/bosai/forecast/data/forecast/130000.json
    

    View Slide

11. 説明としてとても分かりやすい文献
    気象庁の天気予報JSONファイルをWebAPI的に利用したサンプルアプリ
    https://anko.education/apps/weather_api
    

    View Slide

12. うまく取得できた
    

    View Slide

13. Airtable 保存部分
    

    View Slide

14. 記録するあたりは従来の記事でばっちり
    スプレッドシートのようにデータ管理できる AirtableをNode-REDノードでデータを書き込んでみる
    https://blog.enebular.com/samples/use-airtable-as-spreadsheet2/
    

    View Slide

15. カラムのフィールドタイプを気をつけた
    

    View Slide

16. Create time は Airtable 側で気を利かせて
    作成日時を入れてくれる素敵フィールドタイプ
    こちらでやる処理が減るし、データベースだと一手間必要なので、めっちゃありがたい。検証にも役立つ。
    

    View Slide

17. Date フィールドタイプは、天気 API が持つ
    更新日時を日付を良い感じに扱ってくれる
    ISO 8601 形式で入れる必要があるが、めちゃくちゃ便利
    

    View Slide

18. ありがたいことに 天気 API が持つ更新日時は
    ISO 8601 なのですんなり入る
    他の API で日時データが ISO 8601 じゃない場合は JSONata を駆使するといいです
    https://qiita.com/tseigo/items/e7deb8d6d4902a4aef30
    

    View Slide

19. Date フィールドタイプは Calendar ビューで
    見てやると良い感じに日付で並ぶ
    これは私の WordPress 投稿のログをカレンダーで並べている Airtable ビュー
    

    View Slide

20. 更新日時を見る限り11:00,17:00,5:00が
    予報自体の更新タイミングと分かった
    

    View Slide

21. これに関してアドバイスいただけた
    ありがとうございます！
    

    View Slide

22. アウトプットしてやり取りできて
    より深掘りできて、ありがたや
    

    View Slide

23. 予報テキストはわりと全角ゴリ押し
    さらに文字に応じてアイコンにするときは手間がかかりそう
    

    View Slide

24. 風向き・風力がでるのは面白い
    何かに使いたい（全角ではあるんですけどね、変換はがんばりましょう）
    

    View Slide

25. 地域に応じて取得するときは
    都道府県IDをちゃんと把握して取得する必要
    都道府県 ID というのがあるそう
    参考： https://support.smp.ne.jp/manuals/field_reference2/
    https://www.jma.go.jp/bosai/
    forecast/data/forecast/130000.json
    

    View Slide

26. 自動化の目線で enebular 実行環境を考えたこと
    

    View Slide

27. 自動化をつくる流れ
    おおまかにこんな流れ
    まず
    つくる
    動かし
    つづける
    どこかで
    動かす
    より
    良くする
    

    View Slide

28. 自動化をつくる流れ
    まず
    つくる
    動かし
    つづける
    どこかで
    動かす
    より
    良くする
    

    View Slide

29. ワークスペースでデバッグを見れるし
    実行環境のログでも見れる
    プロコードでログ見れる環境をつくるのはパワーが必要。手元はいいけど、サーバーやクラウドで置くとき。
    

    View Slide

30. debug ノードでシステムコンソールを
    チェックすると実行環境ログに出ます
    

    View Slide

31. 自動化をつくる流れ
    まず
    つくる
    動かし
    つづける
    どこかで
    動かす
    より
    良くする
    

    View Slide

32. オンライン上でどう実行させるかが
    課題になりがちだが肩代わりしてやってくれる
    自前でしっかりつくるのはそれなりにパワーと手間が必要なのだがボタン一発でありがたい
    

    View Slide

33. 自動化をつくる流れ
    まず
    つくる
    動かし
    つづける
    どこかで
    動かす
    より
    良くする
    

    View Slide

34. 自動化ではスケジュール実行が怯えしがち
    cron 実行めちゃくちゃイメージしづらい問題
    

    View Slide

35. こういうのをブックマークして使う時に
    必死に思い出すが結構脳にツラい
    http://miya0.dyndns.org/pc/settei/crontab.html
    

    View Slide

36. スケジュールトリガーが cron を視覚的に
    人間の思考に戻してくれるのでよい
    実行予定でやりたいことと照らし合わせられる、ミスが減る
    

    View Slide

37. 自動化をつくる流れ
    まず
    つくる
    動かし
    つづける
    どこかで
    動かす
    より
    良くする
    

    View Slide

38. 自分のための自動化は自分の運用力と向き合いがち
    

    View Slide

39. ローコードでつくれると数か月後も
    自分で思い出して自分でメンテナンスしやすい！
    

    View Slide

40. プロコードで最終的につくるときも
    ローコードで固めきるというのはとても大切
    プロコードでデバッグしたり機能追加するのってパワー使うので、enebular のように GUI でやれるのは素敵
    

    View Slide

41. 自動化をつくる流れ
    うまく寄り添ってくれてありがたい！気軽につくって、つくりつづけられる！
    まず
    つくる
    動かし
    つづける
    どこかで
    動かす
    より
    良くする
    

    View Slide

42. エクストラ
    時間があれば
    ● いざ実行環境化しようとしたらLCDPノードつけ忘れて
    一切発動しなかったウッカリ
    ● 天気概況の説明も面白いので、文章認識で天候をスコア
    化できたら面白そう
    ● 東京で参照先ミスってずっと小笠原諸島の天気を見てて
    一瞬戸惑った話
    ● たぶん環境変数で都道府県IDなど動的に入れられるよう
    にすると汎用性高く作れそうだなってアイデア
    ● どこに活用していこうか話 使いやすい中間API、IoTへデータ表示 など
    

    View Slide

43. おおむね動いたので Discover Flow に整えて
    みんなで使えるよう公開するつもりです！
    

    View Slide