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 を使った Web アプリケーション開発/serverless
Search
kiharu sasaki
October 01, 2016
Technology
14
13k
Firebase を使った Web アプリケーション開発/serverless
kiharu sasaki
October 01, 2016
Tweet
Share
More Decks by kiharu sasaki
See All by kiharu sasaki
マルチクラウドナイト/multicloud-night-panel-discussion
kiharu
1
320
Firebaseを使ったリアルタイム同期アプリケーション開発/firebase
kiharu
9
5.3k
15分で分かったつもりになるAngular 2 概要/angular2
kiharu
23
20k
AWS Lambda と Node.js で作るサーバ不要のイベントドリブンアプリケーション/aws-lambda
kiharu
24
9.1k
WordPress サイトを iPhone アプリにしてみた
kiharu
6
1.6k
Other Decks in Technology
See All in Technology
JSX - 歴史を振り返り、⾯⽩がって、エモくなろう
pal4de
2
610
Digitization部 紹介資料
sansan33
PRO
1
4.2k
工具人的一生: 開發很多 AI 工具讓我 慵懶過一生
line_developers_tw
PRO
0
150
ゆるSRE #11 LT
okaru
1
600
Tensix Core アーキテクチャ解説
tenstorrent_japan
0
360
QAはソフトウェアエンジニアリングを学んで実践するのが大事なの
ymty
1
390
Kotlinで学ぶ 代数的データ型
ysknsid25
5
1.1k
開発効率と信頼性を両立する Ubieのプラットフォームエンジニアリング
teru0x1
0
140
原則から考える保守しやすいComposable関数設計
moriatsushi
3
390
What's new in OpenShift 4.19
redhatlivestreaming
1
230
脅威をモデリングしてMCPのセキュリティ対策を考えよう
flatt_security
4
1.6k
Tenstorrent HW/SW 概要説明
tenstorrent_japan
0
390
Featured
See All Featured
Designing for Performance
lara
609
69k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
52
2.8k
Designing for humans not robots
tammielis
253
25k
How to Ace a Technical Interview
jacobian
276
23k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
228
22k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Being A Developer After 40
akosma
90
590k
RailsConf 2023
tenderlove
30
1.1k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Side Projects
sachag
454
42k
Docker and Python
trallard
44
3.4k
Documentation Writing (for coders)
carmenintech
71
4.9k
Transcript
FirebaseΛͬͨ αʔόʔϨε WebΞϓϦέʔγϣϯ։ൃ KIHARU SASAKI 2016.Oct ServerlessConf TOKYO
Freelance bump.hatenablog.com @bump_of_kiharu ⡟ղ加ֹכ ,JIBSV4BTBLJ 崧׃ךؿٗٝزؒٝسؒٝآص، ԍ"OHVMBS7VF"84'JSFCBTF 4*FS̔ꆃ輐禸؝ٝ؟ٕ̔8FCرؠ؎ش̔崧׃ ➙؝؝
What is Firebase? 'JSFCBTFהכ
'JSFCBTFהכ 2011ɹ؟٦ؽأ㨣 2014ɹ(PPHMFח״顠 2016ɹ#BB4ך倜فٓحزؿؓ٦ي խխխխה׃ג鹌⻉ BaaS (Backend as a Service)
♰➂⟃♳ךركٗحػ٦ָⵃ欽
8FC"QQדⵃ欽ׅ'JSFCBTFך⚺ז؟٦ؽأ "VUI ؟٦غ٦؟؎سך涪搀 ׃חծぐفٗغ؎تך ِ٦ؠ٦钠鏾ֶ״ןِ٦ ؠ٦盖椚遤ֲ )PTUJOH إُؗ،זؚٗ٦غٕطح زٙ٦ؙ⢪欽׃ծؐؑ ـٌغ؎ٕؐؑـך،ف
ٔ侧猱דرفٗ؎ 4UPSBHF 歗⫷ծ갈㡮ծ⹛歗זוծ ؝ٝذٝخך،حفٗ٦ س⥂㶷ֶ״ןر٦ةך《 䖤遤ֲ 3FBMUJNF%# 䱸竲ׁגְׅץגךؙ ٓ؎،ٝزח㼎׃ծر٦ ةך⥂㶷הず劍ٔ،ٕ ة؎يד㹋植ׅ
'JSFCBTFךך➭؟٦ؽأ GPS.PCJMF"QQT "OBMZUJDT ٌغ؎ٕ欽،شٔذ؍ؙأ /PUJDBUJPO QVTI鸐濼 5FTU-BC 暟椚畭劣ח״"OESPJE، فٔךذأز㹋倵 "E.PC
.PCJMF"QQ欽䎢デ邌爙 3FNPUF$POH 鏣㹀ػًٓ٦ةח״،فٔך⹛ ⡲ؕأةو؎ؤ %ZOBNJD-JOLT ،فٔך؎ٝأز٦ٕ剣搀חַַ ׆،فٔⰻך暴㹀皘䨽פ钷㼪 $SBTI3FQPSUJOH ،فٔךؙٓحءُ䞔㜠 ꧊ ׃ծ䕦갟䏝瘝ךⴓ匿遤ֲ
Overview ؟٦ؽأ嚊銲
%&.0 bit.ly/demo-chat 'JSFCBTFך$PEFMBCדⰕׁגְ؝٦س ♧鿇㢌刿׃ג⢪欽׃גְתׅ
3FBMUJNF%BUBCBTF 0OMJOF0JOF ๏ 侧ىٔ猱⟃ⰻחⰋגךؙٓ؎،ٝزחず劍 ๏ 䗁䌓䖓ח荈⹛涸חر٦ةず劍 ๏ ؔؿٓ؎ٝ儗ך⥂㶷갫笝䭯ׁ ؔؿٓ؎ٝ儗
ؔٝٓ؎ٝ儗 ؔٝٓ؎ٝ䗁䌓 ๏ ر٦ةך⥂㶷ָ〳腉ٗ٦ٍٕؕؗحءُ ๏ ِ٦ؠ٦ָ乼⡲竰竲ֿׅהָ〳腉 ๏ ؔٝٓ؎ٝ朐䡾ך㢌刿嗚濼ָ〳腉 侧ىٔ猱⟃ⰻדず劍 ؔؿٓ؎ٝ儗ر٦ة⥂䭯
3FBMUJNF%BUBCBTF /P42-EBUBCBTF ๏ /P42-,74 ๏ Ⰻر٦ةאך+40/ח呓秛 ๏ ر٦ة圓鸡ָךתת3&45"1*ח ๏
ر٦ةך،ؙإإٔ٦ٕ鏣㹀〳腉 إُؗٔذ؍ٕ٦ٕ { "users": { "uid001": { "name": "Fujiwara" } }, "messages": { "id-‐001": { "name": "Fujiwara", "text": "hello!" }, ...... } }
3FBMUJNF%BUBCBTF %BUBBDDFTT ๏ ر٦ةך刿倜כծ鷄⸇٥㢌刿٥ ꤐ欽"1*⢪欽 ๏ ر٦ةך朐䡾㢌⻉כぐ؎كٝز 飑铣׃ג嗚濼 ๏
♧鿇ך"1*כ1SPNJTF鵤ׅ ๏ زٓٝؠؙءّٝ㼎䘔 var db = firebase.database(); var ref = db.ref('messages'); ref.push({ name: "Sasaki", text: "Hello world" }).then(function() { // do something }).catch(function(err) { // do something }); 【データ追加 例】
3FBMUJNF%BUBCBTF 2VFSJFT ๏ ⚛ן갫ծ《䖤⟝侧ծ眔㔲䭷㹀遤ֲًاحسⵃ欽ׅ ๏ ًاحسثؑ٦ٝד勴⟝醱侧籬־ג䭷㹀〳腉 ๏ POPPODFر٦ة㢌刿ך؎كٝزٔأش٦ך涫ꐮ٥鍑ꤐ var
db = firebase.database(); var ref = db.ref('messages'); ref.limitToLast(50).on('child_added', function(data) { // do something }); 【例】
3FBMUJNF%BUBCBTF 3&45GVM"1* curl 'https://<YOUR-‐FIREBASE-‐APP>.firebaseio.com/users/uid001.json' 【GET例】 { "users": {
"uid001": { "name": "Fujiwara" } }, ...... } ๏ ر٦ةךꥡ㾴圓鸡ח״ծぐر٦ةח ♧䠐ך63-ָ♷ִծ3&45ؒٝسه ؎ٝزה׃ג⢪欽דֹ
"VUIFOUJDBUJPO ๏ ぐفٗغ؎ت،ؕؐٝزח״钠鏾ֶ ״ןِ٦ؠ盖椚 0"VUIؿٗ٦إحءّٝ盖椚 ๏ ؕأةي钠鏾堣腉ח״荈؟٦ؽأ ،ؕؐٝزדךؚٗ؎ٝ〳腉 ๏
،ؕؐٝزח醱侧ך钠鏾فٗغ؎ت ׇֿׁؙٔٝה〳腉 ! # $ % & FNBJMQBTTXPSEؚٗ؎ٝ〳
var auth = firebase.auth(); // Sign in Firebase using
popup (Google account) var provider = new firebase.auth.GoogleAuthProvider(); auth.signInWithPopup(provider); // Sign out auth.signOut(); 【Google アカウントによるOAuth 例】 "VUIFOUJDBUJPO ֽֿ
)PTUJOH 搀俱فٓٝד44- )551 杝荈 سً؎ٝךⵃ欽ָⵃ欽〳腉 ๏ (PPHMFךؚٗ٦غٕז$%/ח佄ִ ⚅歲鋉垷ךٗ٦سٖ؎ذٝء ๏ 44-
)551ָرؿٕؓزד䱰欽 ๏ 杝荈سً؎ٝךⵃ欽〳腉 搀俱 ๏ $-*ח״؝وٝسאדرفٗ؎ ๏ ؝ٝا٦ٕ♳דرفٗ؎㾶娖ך然钠ծ ٗ٦ٕغحؙ〳腉
4UPSBHF (PPHMF$MPVE4UPSBHFחر٦ةָ 呓秛ׁծ($1⢪欽׃ג ؟٦غ٦؟؎سדךⳢ椚〳腉 ๏ ِ٦ؠ٦ך歗⫷װ⹛歗ծ갈㡮瘝ך؝ٝذ ٝخ⥂盖կلةغ؎ز鋉垷ך؝ٝذٝ خ،حفٗ٦سדֹ ๏ (PPHMF$MPVE4UPSBHFךغ؛حزח呓秛
ׁծ($4"1*⢪ֲֿהד圫ղ זⵖ䖴〳腉 ๏ ر٦ةח㼎׃،ؙإإٔ٦ٕ鏣㹀〳腉 'JSFCBTFTUPSBHFإُؗٔذ؍ٕ٦ٕ
Caution points 涪٥麊欽儗ך殅䠐挿
/P42-%BUBCBTF ๏ 3%#ך״ֲזؙؒٔ乼⡲כדֹזְ ⢽MJLF BWFSBHF ๏ ر٦ة圓鸡כ〳腉זꣲؿٓحزח׃ծ זץֻطأزׇׁזְ 姻鋉⻉〳腉זꣲׇ׆ءٝفٕח
/P42-ך暴䚍崞ַ׃ⵃ欽䗰ָֽ 膴3%#膷
أذ٦آؚٝ橆㞮זו ๏ 'JSFCBTFךمأذ؍ؚٝחכ %FWFMPQNFOU4UBHJOH1SPEVDUJPO הְ橆㞮כ暴ח欽䠐ׁגְזְ ךדծⴽךفٗآؙؑزה׃ ג⡲䧭ׅ ךך搀俱فٓٝ
؟٦غ٦؟؎سⳢ椚 ๏ ؟٦غ٦؟؎سדךⳢ椚䗳銲הׅך כծ(PPHMF$MPVE'VODUJPOTװך➭ ($1ך堣腉ⵃ欽ֿׅהדծ؟٦غ٦ٖ أז麊欽㹋植 ׃($'כ植㖈،ٕؿ؋晛˟䎃剢植㖈 ⢽$MPVE7JTJPO"1*ה'VODUJPOTⵃ欽׃歗⫷鍑匿ך؟ٝفٕ IUUQTHJUIVCDPNNDEPOBNQBNJOHTQFDT
ً٦ٕ鷏⥋ ๏ ً٦ٕ،سٖأ钠鏾⟃㢩דً٦ٕ鷏⥋ 遤ְְ㜥さכծ㢩鿇ךؙٓؐس؟٦ؽ أ穈さׇֿהד؟٦غ٦ٖأז 麊欽㹋植 ⢽;BQJFSה4FOEHSJEⵃ欽׃ծر٦ة鷄⸇ךة؎ىؚٝדً٦ٕꂁ⥋ׅ IUUQTTFOEHSJEDPNEPDT*OUFHSBUF5VUPSJBMT;BQJFS TFOEJOH@XIFO@OFX@SFCBTF@DIJME@SFDPSET@BEEFEIUNM
Enjoy your serverless LIFE! KIHARU SASAKI 2016.Oct ServerlessConf TOKYO