ビジュアルプログラミングのみで作るLINE + IoT の仕組み2022年4月20日 (水)LINE DC Monthly LT #1 @オンライン豊田陽介( )@youtoy
View Slide
自己紹介ビジュアルプログラミングIoTLT共同主催、その他にも豊田陽介( )普段は、某通信会社勤務@youtoy・IT系イベント主催、登壇や運営なども・子ども向けの活動(IT系以外も)・技術書・技術記事の執筆も(IoT関連など)プライベートでの活動・ Microsoft MVP(2021/10 から)・ガジェット好きその他
作ったものの動作概要・動画
LINE のリッチメニューの操作動作概要: 通信は「LINE⇒デバイス」LEDテープの点灯、電子ペーパーの書きかえデバイスで音の再生(全て実行)①M5Stack系のデバイスでボタン押下LINE Notify でメッセージ通知②
動作概要: 通信は「デバイス⇒LINE」M5Stack系のデバイスでボタン押下LINE Notify でメッセージ通知②LINE のリッチメニューの操作LEDテープの点灯、電子ペーパーの書きかえデバイスで音の再生(全て実行)①
デモ動画
どんな技術を使っている?
主なキーワード:LINE Bot、リッチメニュー、LINE Notify、enebularのクラウド実行環境、Node-RED、M5Stack・UIFlow、Beebotte・MQTT
Botサーバー+α構成①: LINEからデバイスへM5PaperLINE NotifyHTTP(POST)HTTP(POST)MQTTMQTTHTTP(POST)M5StickCPlusM5StackCore2リッチメニューの操作
Botサーバー+αBeebotteでHTTP(POST)をMQTTにM5PaperLINE NotifyHTTP(POST)HTTP(POST)MQTTMQTTHTTP(POST)M5StickCPlusM5StackCore2リッチメニューの操作
(REST API、MQTT)M5StackCore2構成②: デバイスからLINEへM5StickCPlusM5PaperLINE NotifyスマホのLINEアプリリッチメニューの操作HTTP(POST)HTTP(POST)MQTTMQTTHTTP(POST)
クラウド実行環境(HTTPトリガー)Botサーバー+α(REST API、MQTT)M5StackCore2作ったものの構成(全体)M5StickCPlusM5PaperLINE NotifyスマホのLINEアプリリッチメニューの操作HTTP(POST)HTTP(POST)MQTTMQTTHTTP(POST)
詳細を話す時間がなさそうなので
今日の話に関するQiitaの記事enebular や Beebotte関連の話
(まだ公開しきれてない記事も...)
ざっくりな内容説明:設定・実装
クラウド実行環境(HTTPトリガー)Botサーバー+α(REST API、MQTT)M5StackCore2LINE・enebular・BeebotteM5StickCPlusM5PaperLINE NotifyスマホのLINEアプリリッチメニューの操作HTTP(POST)HTTP(POST)MQTTMQTTHTTP(POST)
LINE関連の設定: GUIベースLINE Messaging APILINE Notifyリッチメニュー
enebularの実行環境の設定: GUI今回のサーバー(HTTPトリガー)LINE・デバイスからのPOST先の設定など
enebularでの実装(Node-RED)フロー型のビジュアルプログラミングLINE・デバイスからのPOSTを受けての処理
enebularでの実装内容デバイス ⇒ LINE NotifyLINE(Bot) ⇒ デバイスBeebotteとの連携
Beebotteの設定: GUIベースMQTT・REST API を扱うための準備enebular ⇄ デバイスのつなぎ役
クラウド実行環境(HTTPトリガー)Botサーバー+α(REST API、MQTT)M5StackCore2M5Stack系のデバイスM5StickCPlusM5PaperLINE NotifyスマホのLINEアプリリッチメニューの操作HTTP(POST)HTTP(POST)MQTTMQTTHTTP(POST)
M5Stack系デバイスでの実装(UIFlow)ブロック型のビジュアルプログラミング
M5StickC Plusでの実装内容1MQTT関連のセットアップ画面の初期化まわり等
M5StickC Plusでの実装内容2MQTT のサブスクライブ↓LEDテープ制御など本体ボタン押下を↓LINE通知処理等
テキストプログラミングを使わない「LINE+IoT」の完成
センサー活用なども考えていければ!
記事の執筆などについて豊田陽介( )普段は、某通信会社勤務@youtoy・IT系イベント主催、登壇や運営なども・子ども向けの活動(IT系以外も)・技術書・技術記事の執筆も(IoT関連など)プライベートでの活動・ Microsoft MVP(2021/10 から)・ガジェット好きその他
LINE関連でQiitaに書いた記事Qiitaで「line user:youtoy」で検索するとJavaScript、ビジュアルプログラミング関連で、試しにサービスをつないでみた話が多い(Azure Functions、Azure IoT Hub、MIT App Inventor、UIFlow、など)
ビジュアルプログラミング+IoT関連先月出版された本で作例を
終わり!