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
180
M5ATOMでNintendo Switchを自動化してみた
miso
0
420
ngrokを使ったLINE Bot開発を超絶楽ちんにする「linegrok」のご紹介
miso
0
410
opnizのご紹介
miso
0
810
ルービックキューブスクランブラーが欲しかったので作ってみた
miso
0
760
MineCraftのレッドストーンを現実世界まで拡張してみた
miso
0
150
TypeScriptでIoT開発できるらしいDeviceScriptのご紹介
miso
0
610
ngrokを使ったLINE Bot開発を超快適にする「linegrok」のご紹介
miso
0
460
ひとりopniz Meetup vol.1「opnizとは(迫真)」
miso
0
500
Other Decks in Technology
See All in Technology
A2Aのクライアントを自作する
rynsuke
1
170
急成長を支える基盤作り〜地道な改善からコツコツと〜 #cre_meetup
stefafafan
0
120
GitHub Copilot の概要
tomokusaba
1
130
Javaで作る RAGを活用した Q&Aアプリケーション
recruitengineers
PRO
1
100
Кто отправит outbox? Валентин Удальцов, автор канала Пых
lamodatech
0
330
地図も、未来も、オープンに。 〜OSGeo.JPとFOSS4Gのご紹介〜
wata909
0
110
20250623 Findy Lunch LT Brown
3150
0
850
Fabric + Databricks 2025.6 の最新情報ピックアップ
ryomaru0825
1
130
プロダクトエンジニアリング組織への歩み、その現在地 / Our journey to becoming a product engineering organization
hiro_torii
0
130
rubygem開発で鍛える設計力
joker1007
2
190
Liquid Glass革新とSwiftUI/UIKit進化
fumiyasac0921
0
200
登壇ネタの見つけ方 / How to find talk topics
pinkumohikan
3
350
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
20k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
281
13k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
33
5.9k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
RailsConf 2023
tenderlove
30
1.1k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.2k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
670
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
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︕