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
1k
Firebaseで作るIoTバックエンド
キノコがIoTについて勉強する会の発表資料です。
Yosuke Onoue
February 12, 2017
Tweet
Share
More Decks by Yosuke Onoue
See All by Yosuke Onoue
ネットワーク可視化の世界
likr
7
6k
Think About Front-end Web Development with Rust
likr
2
510
Yewにおけるoff-the-main-thread
likr
1
720
行政事業レビューデータの可視化 / Visualization of Japan's National Budget with JUDGIT!
likr
1
210
モダンJavaScript再入門 / Re-introduction to Modern JavaScript
likr
24
11k
Web-based Data Visualization with Rust and WebAssembly
likr
4
5.6k
Introduction to Graph Drawing
likr
0
470
20190707Ionic_Meetup.pdf
likr
0
400
About the end of the web
likr
2
500
Other Decks in Technology
See All in Technology
LINE NEWSにおけるバックエンド開発
lycorptech_jp
PRO
0
230
Pwned Labsのすゝめ
ken5scal
1
400
AWS Well-Architected Frameworkで学ぶAmazon ECSのセキュリティ対策
umekou
2
140
EMConf JP 2025 懇親会LT / EMConf JP 2025 social gathering
sugamasao
2
190
役員・マネージャー・著者・エンジニアそれぞれの立場から見たAWS認定資格
nrinetcom
PRO
3
5.8k
わたしがEMとして入社した「最初の100日」の過ごし方 / EMConfJp2025
daiksy
14
4.9k
ウォンテッドリーのデータパイプラインを支える ETL のための analytics, rds-exporter / analytics, rds-exporter for ETL to support Wantedly's data pipeline
unblee
0
120
MIMEと文字コードの闇
hirachan
2
1.4k
入門 PEAK Threat Hunting @SECCON
odorusatoshi
0
150
分解して理解する Aspire
nenonaninu
2
1k
手を動かしてレベルアップしよう!
maruto
0
200
Snowflakeの開発・運用コストをApache Icebergで効率化しよう!~機能と活用例のご紹介~
sagara
1
430
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
80
8.9k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
40
2k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
Optimizing for Happiness
mojombo
376
70k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
Thoughts on Productivity
jonyablonski
69
4.5k
Building Your Own Lightsaber
phodgson
104
6.2k
Six Lessons from altMBA
skipperchong
27
3.6k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Bootstrapping a Software Product
garrettdimon
PRO
306
110k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
366
25k
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