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
350
ngrokを使ったLINE Bot開発を超絶楽ちんにする「linegrok」のご紹介
miso
0
350
opnizのご紹介
miso
0
750
ルービックキューブスクランブラーが欲しかったので作ってみた
miso
0
660
MineCraftのレッドストーンを現実世界まで拡張してみた
miso
0
130
TypeScriptでIoT開発できるらしいDeviceScriptのご紹介
miso
0
560
ngrokを使ったLINE Bot開発を超快適にする「linegrok」のご紹介
miso
0
430
ひとりopniz Meetup vol.1「opnizとは(迫真)」
miso
0
470
Other Decks in Technology
See All in Technology
エンジニアリング価値を黒字化する バリューベース戦略を用いた 技術戦略策定の道のり
kzkmaeda
6
2.7k
役員・マネージャー・著者・エンジニアそれぞれの立場から見たAWS認定資格
nrinetcom
PRO
3
6k
アジャイルな開発チームでテスト戦略の話は誰がする? / Who Talks About Test Strategy?
ak1210
1
580
ExaDB-XSで利用されているExadata Exascaleについて
oracle4engineer
PRO
3
250
ディスプレイ広告(Yahoo!広告・LINE広告)におけるバックエンド開発
lycorptech_jp
PRO
0
360
【Findy】「正しく」失敗できる チームの作り方 〜リアルな事例から紐解く失敗を恐れない組織とは〜 / A team that can fail correctly by findy
i35_267
5
880
Two Blades, One Journey: Engineering While Managing
ohbarye
4
2k
30→150人のエンジニア組織拡大に伴うアジャイル文化を醸成する役割と取り組みの変化
nagata03
0
170
4th place solution Eedi - Mining Misconceptions in Mathematics
rist
0
140
株式会社Awarefy(アウェアファイ)会社説明資料 / Awarefy-Company-Deck
awarefy
3
11k
日経のデータベース事業とElasticsearch
hinatades
PRO
0
230
RemoveだらけのPHPUnit 12に備えよう
cocoeyes02
0
290
Featured
See All Featured
Building Adaptive Systems
keathley
40
2.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
The Pragmatic Product Professional
lauravandoore
32
6.4k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
How to Ace a Technical Interview
jacobian
276
23k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.6k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.5k
Building Applications with DynamoDB
mza
93
6.2k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
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︕