RetoolとAWSでIoTデータ可視化基盤を最速で作ってみた #devio2021/iot-data-visualization-with-retool-and-aws

フロントアプリの運用保守を意識せずローコードでアプリを作れる「Retool」を使って、IoT機器から収集したデータを簡単に可視化するアプリを作ってみます。

以下の動画で使用したスライドなので、詳細気になる場合は以下の動画をご覧ください。
「RetoolとAWSでIoTデータ可視化基盤を最速で作ってみた #devio2021」
https://www.youtube.com/watch?v=85sQp5JKAEU

Transcript

1. 3FUPPMͱ"84Ͱ*P5σʔλՄࢹԽج൫Λ࠷଎Ͱ࡞ͬͯΈͨ
   
   $9ࣄۀຊ෦*P5ࣄۀ෦
   ࠤ౻ஐथ
   

   View Slide

2. ໨࣍
   wࠓճͷϨγϐ
   w3FUPPMͱ͸
   wશମͷߏ੒ਤ
   w࡞ͬͯΈΔ
   wະདྷͷߏ੒ਤ
   

   View Slide

3. ࠓճͷϨγϐ
   w3FUPPMºݸ τϥΠΞϧ1SPϓϥϯ
   
   w"84ºΞΧ΢ϯτ
   w"84$%,º ҎԼͷϦιʔεͷల։ʹར༻
   
   w"84*P53VMFºϧʔϧ
   w"NB[PO%ZOBNP%#ºςʔϒϧ
   w*".3PMF6TFSೝূΩʔFUDʜ
   

   View Slide

4. w6*ϥΠϒϥϦ΍σʔλιʔεɺΞΫηεݖݶͱ֨ಆͤͣ
   ϑϩϯτΞϓϦΛߏஙͰ͖ΔαʔϏε
   3FUPPMͱ͸
   Anything Service & API Table & Modal & Chart & Form & etc
   Front Application
   ը૾Ҿ༻ݩɿ
   ʮRetool | Build internal tools, remarkably fast.ʯhttps://retool.com/
   ʮBuild internal tools with DynamoDBʯhttps://retool.com/integrations/aws-dynamodb
   

   View Slide

5. 3FUPPMΛ࢖͏ͱԿ͕خ͍͠ͷ͔
   wগͳ͍࣌ؒͰ1P$Λ࣮ફमਖ਼Ͱ͖Δ
   wϑϩϯτΞϓϦͷίʔυϝϯς͕΄΅ෆཁ ϩʔίʔυ
   
   wϚϧνςφϯτରԠ͕؆୯ʹՄೳ
   wࡉ͔͍Ϣʔβݖݶઃఆ
   w(PPHMF΍"%ɺ0LUBͳͲʹΑΔ4".-440 &OUFSQSJTF൛ͷΈ
   
   1P$͔Βεέʔϧ͢ΔαʔϏε·Ͱ࢖͑Δ
   

   View Slide

6. શମ૾
   ࠓճͷϨγϐ
   AWS Cloud
   IoT thing
   generic
   Amazon DynamoDB
   AWS IoT Core
   IoT
   topic
   AϢʔβ BϢʔβ CϢʔβ
   'SPOU"QQ
   ΞϓϦԽ
   

   View Slide

7. શମ૾
   ࠓճͷϨγϐ
   AWS Cloud
   IoT thing
   generic
   Amazon DynamoDB
   AWS IoT Core
   IoT
   topic
   AϢʔβ BϢʔβ CϢʔβ
   'SPOU"QQ
   ΞϓϦԽ
   AWS CDKͰߏங
   ϩʔΧϧPCͷ
   Node.jsͰૹ৴
   

   View Slide

8. 
   ΍ͬͯΈΔ
   

   View Slide

9. શମ૾
   ࡉ͔͍ϢʔβݖݶઃఆͷΠϝʔδ
   AWS Cloud
   IoT thing
   generic
   Amazon DynamoDB
   AWS IoT Core
   IoT
   topic
   AϢʔβ BϢʔβ CϢʔβ
   'SPOU
   "QQ"
   ΞϓϦԽ
   'SPOU
   "QQ#
   

   View Slide

10. શମ૾
    ະདྷͷߏ੒ਤ
    AWS Cloud
    IoT thing
    generic
    AWS IoT Core
    IoT
    topic
    'SPOU"QQ
    ΞϓϦԽ
    Amazon S3
    Amazon Athena
    AϢʔβ BϢʔβ CϢʔβ
    

    View Slide

11. View Slide