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
330
Firebaseを使ったリアルタイム同期アプリケーション開発/firebase
kiharu
9
5.4k
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
[OCI Skill Mapping] AWSユーザーのためのOCI(2025年8月20日開催)
oracle4engineer
PRO
2
150
小さなチーム 大きな仕事 - 個人開発でAIをフル活用する
himaratsu
0
130
我々は雰囲気で仕事をしている / How can we do vibe coding as well
naospon
2
220
AIエージェントの開発に必須な「コンテキスト・エンジニアリング」とは何か──プロンプト・エンジニアリングとの違いを手がかりに考える
masayamoriofficial
0
410
あとはAIに任せて人間は自由に生きる
kentaro
3
1.1k
JOAI発表資料 @ 関東kaggler会
joai_committee
1
360
Preferred Networks (PFN) とLLM Post-Training チームの紹介 / 第4回 関東Kaggler会 スポンサーセッション
pfn
PRO
1
240
Amazon Bedrock AgentCore でプロモーション用動画生成エージェントを開発する
nasuvitz
6
440
EKS Pod Identity における推移的な session tags
z63d
1
210
マイクロモビリティシェアサービスを支える プラットフォームアーキテクチャ
grimoh
1
240
生成AI利用プログラミング:誰でもプログラムが書けると 世の中どうなる?/opencampus202508
okana2ki
0
190
人を動かすことについて考える
ichimichi
2
330
Featured
See All Featured
Being A Developer After 40
akosma
90
590k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
131
19k
A Modern Web Designer's Workflow
chriscoyier
695
190k
Balancing Empowerment & Direction
lara
2
590
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
6k
Into the Great Unknown - MozCon
thekraken
40
2k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.5k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
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