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
Firebaseで作るIoTバックエンド
Search
Yosuke Onoue
February 12, 2017
Technology
1
950
Firebaseで作るIoTバックエンド
キノコがIoTについて勉強する会の発表資料です。
Yosuke Onoue
February 12, 2017
Tweet
Share
More Decks by Yosuke Onoue
See All by Yosuke Onoue
Think About Front-end Web Development with Rust
likr
2
430
Yewにおけるoff-the-main-thread
likr
1
630
行政事業レビューデータの可視化 / Visualization of Japan's National Budget with JUDGIT!
likr
1
160
モダンJavaScript再入門 / Re-introduction to Modern JavaScript
likr
23
11k
Web-based Data Visualization with Rust and WebAssembly
likr
4
5.1k
Introduction to Graph Drawing
likr
0
390
20190707Ionic_Meetup.pdf
likr
0
350
About the end of the web
likr
2
450
Rust + WebAssemblyで広がるWebの未来
likr
16
6.5k
Other Decks in Technology
See All in Technology
実例で紹介するRAG導入時の知見と精度向上の勘所
yamahiro
7
2.4k
成長をサポートするピープルマネジメントのやり方
sioncojp
9
1.4k
エンジニア候補者向け資料2024.04.24.pdf
macloud
0
3.4k
Handling focus in 2024
tahia910
0
620
Max out Local LLM in Challenging Environments
sashimimochi
2
210
M5stackで使用できるpHセンサの開発
shinrinakamura
1
290
Documentação de Produtos: Artefatos essenciais na prática
rigolon
1
230
生成AIの変革の時代に、直近1年で直面した課題とその解決策
ktc_wada
1
800
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Musicを例に~
otanet
0
330
TiDBにおけるテーブル設計と最適化の事例
cygames
0
260
Gitlab本から学んだこと - そーだいなるプレイバック / gitlab-book
soudai
7
1.4k
uvを使ってストレスフリーな Python開発をしよう!
r74tech
0
260
Featured
See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
66
14k
4 Signs Your Business is Dying
shpigford
176
21k
Bash Introduction
62gerente
605
210k
A Tale of Four Properties
chriscoyier
153
22k
For a Future-Friendly Web
brad_frost
172
9k
Making Projects Easy
brettharned
109
5.5k
Debugging Ruby Performance
tmm1
70
11k
Navigating Team Friction
lara
179
13k
A better future with KSS
kneath
231
16k
Building Applications with DynamoDB
mza
88
5.6k
Six Lessons from altMBA
skipperchong
22
3k
A designer walks into a library…
pauljervisheath
201
23k
Transcript
Firebaseͽ֢ΡIoTϝϐμεЀϖ ͠΄͜͞ (@_likr) κϛπ͢IoTͺ͚ͼۣ䔶ͯΡտ
ᛔ૩奧Օ • ͠΄͜͞ (@_likr) • Ղ᮷य़ 檭ᣟݳᣟݳරᙙᎸᑪവ昲ψЀόЄ ᒽ΄͵Η΄ᑀϳϘϐϕ ᇙਧۗර •
ૡᎸᑪᑀ΄櫮䶲ૡ䌑ධͼ ;ͩΣΨץԧͭ͵䶲ͯ͢Ρ • ng-kyoto̵GDGᐟ䜜̵KFUG • ݢ憙۸΄Ꮈᑪ;͡ΚͼΡ • ͺͥ͵ https://egrid.jp/
扖ٖͯ • JavaScript + IoTΨᘍ͞Ρ • ฌՔ΄JavaScript&WebϢϺЀϕεЀϖԪఘΨ承Ρ • JavaScript +
RaspberryPI ͽ֢͵Θ΄Ψ奧ՕͯΡ
JavaScript;IoT
JavaScript • Ԇϣ϶γσӤͽ㵕֢ͯΡ敽ᰁϤϺν϶ϬЀν承 • 㵕ጱࣳ՞ͧ • ϤϺόαϤϦЄφ΄ηϣυδμϕݻ • ๋ᬪͷΝ;Δ;Θ͵(ES2015뺶) •
arrow function • class • Promise • ϣ϶γσզक़ͽΘڥአ͢䓈͢ͼ͚Ρ
ϣ϶γσզक़΄厏ह • πϫЀϖ϶αЀϑЄϸ̵ςЄϝςαϖ • Node.js • ϔφμϕϐϤίϤϷ • Electron̵NW.js •
ϜαϣϷϐϖίϤϷ • Ionic̵Onsen UI̵React Native̵…
JavaScript;IoT • Node.js䌏䖕 • Arduino (Johnny-Five) • RaspberryPI • Intel
Edison • Tessel • https://tessel.io/ • Firefox OS • ᜉ͚ΚͺͶ͵΄…
JavaScriptͶͧͽᜋ̸ͽͣΡ
JavaScriptͽIoTϢϸφόϐμ IoTϔϝαφ IoTϝϐμεЀϖ ϢϺЀϕεЀϖ Web / ίϤϷ ςЄϝ Webϣ϶γσ φϫЄϕϢζЀ
ϔφμϕϐϤ ίϤϷ DB ᥴຉ ψЀςЄ ϷϯπЀ … ͩͩ΄扖 ͩͩΨ͚͡䮭ͯΡ͡Ҙ
Firebase • Google΄׀ͯΡBaaS (Backend as a Service) • Ԇ䱛ᚆ •
扯戣 • ϮЄϸ扯戣̵OAuth (Twitter̵Facebook̵…) • ϷίϸόαϭDB • Ϸίϸόαϭݶ๗ݢᚆφκЄϫϹφDB • ϨφϓΰЀν • ᇿᛔϖϮαЀ̵HTTPS̵HTTP/2䌏䖕 • 僻ාϤ϶Ѐ͘Π
αϮЄυ Webϣ϶γσ φϫЄϕϢζЀ ϔφμϕϐϤ ίϤϷ ᥴຉ ψЀςЄ
ฌՔ΄JavaScriptԪఘ
JavaScriptϤϺν϶ϬЀν΄ᝒ䘁 • 揞୧承䱛ᚆ ꔄ ϕ϶ЀφϞα϶ • ϯυϲЄϸτφϓϭ΄ӧࣁ ꔄ ϯυϲЄϸϝЀϖ϶ •
WebϢϺЀϕεЀϖྲ᯿΄䃀ے ꔄ WebϢϺЀϕεЀϖϢϹЄϭϼЄμ
ϕ϶ЀφϞα϶;ϯυϲЄϸϝЀϖ϶ • ϕ϶ЀφϞα϶ • JS΄䱛ᚆΨ䝭䔴̵ݘ͚ϣ϶γσΎ΄䌏䖕 • Babel̵TypeScript • ϯυϲЄϸϝЀϖ϶ •
愢හ΄JSϢήαϸᒵΨ㶨Ӟ΄ϢήαϸΔ;ΗΡ • Node.jsφόαϸ΄ϤϺν϶ϬЀν(CommonJS) • Webpack • loaderͽϕ϶ЀφϞαϸΘݢᚆ
Webpack • https://webpack.js.org/ • ϺЄύЄ̵Ϥ϶ναЀΞΡ䝭䔴 • Webpack 2 • Tree
Shaking • webpack-dev-server • ϺЄθϸ樄咲አςЄϝ • ϶αϣϷϺЄϖ • BrowserHistoryΎ΄ϢζЄϸϝϐμ
Babel • https://babeljs.io/ • ๋ෛ΄ES΄՛䯭ᒵΨES5䄜䟵 • ES(ECMA Script) • JavaScript΄䰤伛憒໒
• https://kangax.github.io/compat-table/es6/ • plugin̵presetΞΠ䝭䔴 • babel-preset-es2017̵babel-preset-react
WebϢϺЀϕεЀϖϢϹЄϭϼЄμ • SPA(Single Page Application)΄ฦ݊ • JavaScriptΞΡUI䯤塈΄ྲ᯿͢䃀ے • DOM̵֢ϔЄόϢϺЄ΄愢櫏۸Ύ΄䌏䖕 •
Angular̵ReactJS̵… ϒϥβ HTMLΨኞ౮ ίϤϷξЄτϴЀ ςЄϝ 8FCαʔό ϒϥβ ᶉጱϢήαϸΨᯈמ "1*αʔό JSONᒵΨኞ౮ ϚαϓΰϣίϤϷ 䕪΄WebίϤϷ SPA
ReactJS • https://facebook.github.io/react/ • Facebook͢樄咲ͯΡηЄϤЀϊЄφ΄ WebϢϺЀϕεЀϖView϶αϣ϶Ϸ • 㫪మDOM • DOM
(Document Object Model) • ᥝ᮱ړͶͧΨๅෛͯΡͩ;ͽ㵁ሲጱൈኮ • JSX • HTML϶αμဩͽViewΨਧ嬝ͯΡ
FirebaseͽIoTϝϐμεЀϖΨ֢Ρ
ፓጱ • ψЀςЄᒵ΄ϔЄόΨᵞ坌ͯΡ • Webϣ϶γσӤͽݢ憙۸ͯΡ • ค֢͵ΚͺΨςЄϠφΓͥͯΡ • https://vizlab-thermometer.firebaseapp.com/ •
AngularFire + D3.js
䯤౮ • RaspberryPI 1 TypeB • Firebase • 扯戣̵ϷίϸόαϭDB̵ϨφϓΰЀν •
WebϢϺЀϕεЀϖ • ReactJS̵D3.js • webpack 2̵babel • https://github.com/likr/thermoviz
None
ϔϯ • https://thermoviz.firebaseapp.com/ • ϔϯίθγЀϕ •
[email protected]
/ kinoko_iot •
ෛ憒ίθγЀϕ֢౮΅ګᴴӾ • Θֵ͚ͭ͵͚Ո΅्͠䟑ͧͥͶ͚ͫ…
Δ;Η • JavaScript͢ͷΝ;ͶͧΔ;Θͼ̵ ᜋ̸;ͩΣͽֵΥΡΞ͜ͼͣ͵ • JavaScriptΨ憝͞Άϔϝαφ΄ګக̵ςЄϝ̵ μ϶αίЀϕᒵIoTᥝΘ΄͢䟦͞ΟΡҁ͡Θ҂ • FirebaseΨֵ͞ΆψЀςЄϔЄό΄ᵞ坌Κݢ憙۸͢䮭 •
ᇙ᪁ޱ̵抅ਹꁿϹϦϸͽ͚͢͡Ҙ
FRONTEND CONFERENCE 2017