Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
すぐできる!JavaScriptでIoT!
Search
田中みそ
November 30, 2019
Technology
1
150
すぐできる!JavaScriptでIoT!
「冬のJavaScript祭 in メンバーズキャリア(
https://javascript-fes.doorkeeper.jp/events/99978)」での登壇資料です
。
田中みそ
November 30, 2019
Tweet
Share
More Decks by 田中みそ
See All by 田中みそ
LINE x IoT 入門ハンズオン
miso
0
150
M5ATOMでNintendo Switchを自動化してみた
miso
0
330
ngrokを使ったLINE Bot開発を超絶楽ちんにする「linegrok」のご紹介
miso
0
330
opnizのご紹介
miso
0
740
ルービックキューブスクランブラーが欲しかったので作ってみた
miso
0
640
MineCraftのレッドストーンを現実世界まで拡張してみた
miso
0
120
TypeScriptでIoT開発できるらしいDeviceScriptのご紹介
miso
0
550
ngrokを使ったLINE Bot開発を超快適にする「linegrok」のご紹介
miso
0
420
ひとりopniz Meetup vol.1「opnizとは(迫真)」
miso
0
460
Other Decks in Technology
See All in Technology
Active Directory の保護
eurekaberry
3
2k
データ基盤の成長を加速させる:アイスタイルにおける挑戦と教訓
tsuda7
1
310
Tokyo RubyKaigi 12 - Scaling Ruby at GitHub
jhawthorn
2
220
Grid表示のレイアウトで Flow layoutsを使う
cffyoha
1
150
2025/1/29 BigData-JAWS 勉強会 #28 (re:Invent 2024 re:Cap)/new-feature-preview-q-in-quicksight-scenarios-tried-and-tested
emiki
0
320
Autify Company Deck
autifyhq
2
41k
顧客の声を集めて活かすリクルートPdMのVoC活用事例を徹底解剖!〜プロデザ!〜
recruitengineers
PRO
0
210
論文紹介 ”Long-Context LLMs Meet RAG: Overcoming Challenges for Long Inputs in RAG” @GDG Tokyo
shukob
0
280
まだ間に合う! エンジニアのための生成AIアプリ開発入門 on AWS
minorun365
PRO
2
140
Grafanaのvariables機能について
tiina
0
190
教師なし学習の基礎
kanojikajino
4
370
レイクハウスとはなんだったのか?
akuwano
15
2k
Featured
See All Featured
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
The Cult of Friendly URLs
andyhume
78
6.2k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
28
4.5k
VelocityConf: Rendering Performance Case Studies
addyosmani
327
24k
Agile that works and the tools we love
rasmusluckow
328
21k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.2k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
Java REST API Framework Comparison - PWX 2021
mraible
28
8.4k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
11
900
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
98
18k
Transcript
すぐできる︕ すぐできる︕ JavaScriptでIoT︕ JavaScriptでIoT︕ すぐできる︕JavaScriptでIoT︕
すぐできる︕JavaScriptでIoT︕
IoT開発のイメージ IoT開発のイメージ すぐできる︕JavaScriptでIoT︕
Arduino Arduino すぐできる︕JavaScriptでIoT︕
Arduino Arduino それ単体ではWeb通信が出来ないので、IoTの 「I(Internet)」の要素が抜けています。 すぐできる︕JavaScriptでIoT︕
ESP32 ESP32 すぐできる︕JavaScriptでIoT︕
ESP32 ESP32 Wi-FiとBluetoothがついたArduino M5Stackなど、これをベースにしたデバイス多数あ り 安い。国内1500円、海外500円ぐらいで買える すぐできる︕JavaScriptでIoT︕
つらみポイント つらみポイント Cっぽいの(スケッチ)を書かなきゃいけない… ドライバー⼊れたり開発環境構築つらい… プログラム書き換えたら、⼀々デバイスを繋いで 書き込みしないといけないののつらい… すぐできる︕JavaScriptでIoT︕
Raspberry Pi Raspberry Pi すぐできる︕JavaScriptでIoT︕
つらみポイント つらみポイント IoTというか、GPIO(トゲトゲしてるとこ) がついてるサーバー OSやミドルウェアの環境管理つらい… すぐできる︕JavaScriptでIoT︕
なかなかサクッと なかなかサクッと IoTできない >< IoTできない >< そんなあなたにおすすめしたいのが… すぐできる︕JavaScriptでIoT︕
すぐできる︕JavaScriptでIoT︕
obnizとは obnizとは ざっくり⾔うとJavaScriptですぐ動くIoTデバイス すぐできる︕JavaScriptでIoT︕
「すぐ動く」 「すぐ動く」 obnizを買ってからデバイス上やることとしては、 電源ケーブル(MicroUSB)を挿す PCからでもモバイルバッテリーでもOK Wi-Fiを設定する(初回のみ) 本体に簡単なスイッチとディスプレイがあり、 デバイス⾃体で設定できる 使いたい電⼦パーツを挿す すぐできる︕JavaScriptでIoT︕
以上。 以上。 あとはソフトウェア側でなんやかんやします すぐできる︕JavaScriptでIoT︕
obnizを構成する要素 obnizを構成する要素 obniz OS obniz Cloud obniz SDK すぐできる︕JavaScriptでIoT︕
obnizを構成する要素 obnizを構成する要素 すぐできる︕JavaScriptでIoT︕
obnizを構成する要素 obnizを構成する要素 すぐできる︕JavaScriptでIoT︕
obniz OS obniz OS デバイス⽤OS obniz Cloudへの接続が役割 8ケタ数字のIDを持っている アクセストークンを発⾏してセキュリティ強化 もできる︕
すぐできる︕JavaScriptでIoT︕
obniz Cloud obniz Cloud obniz OSと連携してハードウェアを操作するAPIを 提供 obnizの本体とも⾔える部分 ユーザー認証やオンラインエディタなどのウェブサ ービスも提供
すぐできる︕JavaScriptでIoT︕
obniz SDK obniz SDK obniz CloudのAPIを各プログラム⾔語で利⽤するた めのSDK JSとPythonがある obniz Cloud
API(Web Socket)を各⾔語でラップ したもの すぐできる︕JavaScriptでIoT︕
個⼈的な推しポイント 個⼈的な推しポイント JavaScriptだけで完結できる︕ プログラムをデバイスに書き込まず、 ローカPCやクラウド上で動かすことができる︕ すぐできる︕JavaScriptでIoT︕
obnizの動かし⽅ obnizの動かし⽅ HTMLで動かす Node.jsで動かす すぐできる︕JavaScriptでIoT︕
HTMLで動かす HTMLで動かす obniz.jsを読み込むだけ <script src="https://unpkg.com/obniz/obniz.js"></script> すぐできる︕JavaScriptでIoT︕
Node.jsで動かす Node.jsで動かす obnizをインストールするだけ npm install obniz すぐできる︕JavaScriptでIoT︕
DEMO DEMO すぐできる︕JavaScriptでIoT︕
Step1. Lチカ Step1. Lチカ (Hello World) (Hello World) すぐできる︕JavaScriptでIoT︕
⼿順(カンペ) ⼿順(カンペ) まずはIoTでのHello WorldことLチカです。 obnizパーツライブラリからLEDを開く obnizにLEDをさす (抵抗つきLEDじゃないとダメ、絶対︕) obniz IDを打ち込んでLチカ https://obniz.io/ja/sdk/parts
すぐできる︕JavaScriptでIoT︕
Step2. HTMLから動かす Step2. HTMLから動かす すぐできる︕JavaScriptでIoT︕
⼿順(カンペ) ⼿順(カンペ) クイックスタート -> obniz, HTML5 下の⽅のソースコピー index.htmlを作成して貼り付け ブラウザで開く >ope
in def(>open in default browserの意) https://obniz.io/ja/lessons/lessons/quickstar すぐできる︕JavaScriptでIoT︕
Step3. Node.jsで動かす Step3. Node.jsで動かす すぐできる︕JavaScriptでIoT︕
Step3. Node.jsで動かす Step3. Node.jsで動かす Step3. Node.jsを使ってLINE Step3. Node.jsを使ってLINE から動かす から動かす
すぐできる︕JavaScriptでIoT︕
こんなかんじで こんなかんじで すぐできる︕JavaScriptでIoT︕
⼿順(カンペ) ⼿順(カンペ) サンプルソース説明 node実⾏ ngrok実⾏ LINE Developerコンソールのエンドポイント更新 オウム返しBot実⾏ obniz対応 参考︓Node.jsクイックスタート
すぐできる︕JavaScriptでIoT︕
require インスタンス化 コネクトをawaitに await obniz.connectWait() パーツライブラリからコピペ 実⾏ https://obniz.io/ja/lessons/server_side/ https://obniz.io/ja/doc/sdk/doc/connect https://obniz.io/ja/sdk/parts
すぐできる︕JavaScriptでIoT︕
obnizでIoTを obnizでIoTを はじめるにあたって はじめるにあたって すぐできる︕JavaScriptでIoT︕
デバイスは何を買えばいい︖ デバイスは何を買えばいい︖ ⼤きく分けて純正ボードとESP32系汎⽤デバイスの 2通り がオススメ ESP32系デバイスは汎⽤性があるものの、 obnizを使うには になる 純正ボード Amazonでも買える
サブスクリプションライセン ス すぐできる︕JavaScriptでIoT︕
電⼦パーツはどこで買えばい 電⼦パーツはどこで買えばい い︖ い︖ obnizの に購⼊先へのリン クあり パーツライブラリページ 秋⽉電⼦通商 秋葉に実店舗あり
SWITCH SCIENCE すぐできる︕JavaScriptでIoT︕
電⼦パーツはどこで買えばい 電⼦パーツはどこで買えばい い︖ い︖ 安く済ませたいなら (海外通販) 国内の半額〜1/10ぐらいで買える 送料も無料のものが多い 届くまで約3週間 そしてたまに届かない
AliExpress すぐできる︕JavaScriptでIoT︕
ここまで簡単にJavaScriptで ここまで簡単にJavaScriptで IoTが始められる時代に IoTが始められる時代に なっています︕ なっています︕ すぐできる︕JavaScriptでIoT︕
(宣伝)LINE API HANDBOOK (宣伝)LINE API HANDBOOK LINE API Expert 11名で書いた350Pの鈍器。
BOOTHにて電⼦版販売中(1,500円) https://booth.pm/ja/items/1573526 すぐできる︕JavaScriptでIoT︕
ご清聴ありがとうございました︕ ご清聴ありがとうございました︕ すぐできる︕JavaScriptでIoT︕