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が導入されてた/Firebase was intr...
Search
kkznch
February 21, 2019
Technology
0
1.2k
自社サービス チャット機能にFirebaseが導入されてた/Firebase was introduced to the chat function of our service
#0 Fukuoka.Firebase@LTイベント
登壇枠で使用
参考URL
https://fukuokafirebase.connpass.com/event/114251
kkznch
February 21, 2019
Tweet
Share
More Decks by kkznch
See All by kkznch
黒い画面へようこそ/Hello, black screen
kkznch
0
380
VueRouterとNuxtのルーティング/VueRouter and Nuxt Routing
kkznch
0
340
Vuexで何を管理する方が良い?/What is better to store in Vuex?
kkznch
1
730
Firestoreのルール設定 割と何でも出来てビビる/Firestore rule setting
kkznch
1
750
LaraCSVで手軽にCSVを出力する/Easily generate CSV by LaraCSV
kkznch
0
1.6k
SPA開発未経験者によるNuxt.jsを使った自社サービス開発 / Development of own service using Nuxt.js by inexperienced SPA development
kkznch
3
3.1k
Laravel Telescopeが便利そうな気がする/Laravel Telescope seems to be convenience
kkznch
1
1.1k
Laravel Novaはなんだかいい感じらしい/Laravel Nova seems to be nice
kkznch
0
620
Laravel5.5的 継続的インテグレーション / Laravel 5.5 Continuous Integration
kkznch
3
3.4k
Other Decks in Technology
See All in Technology
Autify Company Deck
autifyhq
2
41k
カスタムインストラクションでGitHub Copilotをカスタマイズ!
07jp27
4
290
もし今からGraphQLを採用するなら
kazukihayase
9
4.2k
re:Invent Recap (January 2025)
scalefactory
0
340
【Λ(らむだ)】アップデート機能振り返りΛ編 / PADjp20250127
lambda
0
120
2週に1度のビッグバンリリースをデイリーリリース化するまでの苦悩 ~急成長するスタートアップのリアルな裏側~
kworkdev
PRO
8
6.5k
顧客の声を集めて活かすリクルートPdMのVoC活用事例を徹底解剖!〜プロデザ!〜
recruitengineers
PRO
0
200
Grid表示のレイアウトで Flow layoutsを使う
cffyoha
1
150
srekaigi2025-hajimete-ippo-aws
masakichieng
0
240
Zenn のウラガワ ~エンジニアのアウトプットを支える環境で Google Cloud が採用されているワケ~ #burikaigi #burikaigi_h
kongmingstrap
18
6.8k
消し忘れリソースゼロへ!私のResource Explorer活用法
cuorain
0
140
アクセシブルなマークアップの上に成り立つユーザーファーストなドロップダウンメニューの実装 / 20250127_cloudsign_User1st_FE
bengo4com
2
1.2k
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
990
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
192
16k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Mobile First: as difficult as doing things right
swwweet
222
9.2k
Typedesign – Prime Four
hannesfritz
40
2.5k
How to train your dragon (web standard)
notwaldorf
89
5.8k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
127
19k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
RailsConf 2023
tenderlove
29
980
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
39
1.9k
Transcript
ࣗࣾαʔϏε νϟοτػೳʹ Firebase͕ಋೖ͞Εͯͨ גࣜձࣾRe:Build Յ ါىʢ@kkznchʣ 20192݄21ʢʣ #0 Fukuoka.Firebase@LTΠϕϯτ
ࣗݾհ • Յ ါىʢ@kkznchʣ • 1990ͷԭೄੜ·Εɺԭೄҭͪɺԭೄࡏॅ • ܦྺɿ ‣ ిྗձࣾͷITΠϯϑϥɺηΩϡϦςΟ୲
‣ גࣜձࣾRe:BuildͰWebΤϯδχΞ ‣ εϚϒϥSP θϧμʢઓಆྗ350ສલޙɺඇVIPʣ
ձࣾհ • גࣜձࣾRe:Buildʢ201711݄ʹઃཱʣ • ݱࡏͷࣾһ໊̑ • ԭೄΛڌͱ͠ɺجຊతʹLaravelVue.jsΛ ͬͯडୗɾࣗࣾαʔϏε։ൃΛ͍ͯ͠Δ • ϦϞʔτϫʔΫɺࣗ༝ͳಇ͖ํΛਪ͍ͯ͠Δ
ࣗࣾαʔϏε։ൃத
৭Μͳػೳ࣮ͯ͠Δ νϟοτػೳผͷਓ͕୲
ؾ͚ͮνϟοτػೳʹ Firebase͕ಋೖ͞Ε͍ͯͨ
Firebase͔Βͳ͍ ↑ݱ࣮ ษڧձʹࢀՃ͢Δ ͔ΔΑ͏ʹͳΔ ↑ඪ
νϟοτػೳΛҰ͔Β ࡞ͬͨ͜ͱ͋Γ·͔͢ʁ
ϦΞϧλΠϜͳνϟοτ࡞Δ
σʔλϕʔεɾςʔϒϧઃܭ
ϓϩάϥϜ࡞ʢόοΫΤϯυʣ • APIΛ࣮ߦ͢ΔͨΊͷॲཧΛॻ͘ • APIܦ༝ͰϝοηʔδΛऔಘ͢ΔॲཧΛॻ͘ • APIܦ༝ͰϝοηʔδΛอଘ͢ΔॲཧΛॻ͘
ϦΞϧλΠϜߋ৽͢Δख๏ܾΊ • ϙʔϦϯά • ϩϯάϙʔϦϯά • WebSocket
ϙʔϦϯά
ϩϯάϙʔϦϯά
WebSocket
ϓϩάϥϜ࡞ʢϑϩϯτʣ • ϝοηʔδΛऔಘ͢ΔॲཧΛॻ͘ • ϝοηʔδΛૹ৴͢ΔॲཧΛॻ͘ • ϦΞϧλΠϜߋ৽Λߦ͏ॲཧΛॻ͘ • ϙʔϦϯάɺϩϯάϙʔϦϯάɺWebSocket •
औಘ͖ͯͨ͠ϝοηʔδΛඳը͢ΔॲཧΛॻ͘
None
όάͩΒ͚ͷνϟοτػೳ
࣮ʹखؒͱ͔͔࣌ؒΔ
FirebaseͰͬͯΈͨ
લఏ • Firebase͕Կͳͷ͔͔Βͳ͍ • FirebaseͰԿ͕Ͱ͖Δͷ͔͔Βͳ͍ • ຊΠϕϯτͷ3લʹॳΊͯFirebase৮ͬͨ
νϡʔτϦΞϧ
ਆαΠτ
Vue.js + FirebaseͰνϟοτ࡞ΔνϡʔτϦΞϧ
Firebaseίϯιʔϧ
ϓϩδΣΫτΛՃ͢Δ
ೝূํࣜʮGoogleʯΛ༗ޮԽ
DBͷΞΫηεϧʔϧΛఆٛ͢Δ
Vue.js
firebaseϞδϡʔϧΛΠϯετʔϧ ίϚϯυϥΠϯ͔Βୟ͘ main.jsϑΝΠϧͷதͰಡΈࠐΉΑ͏ʹ͢Δ
FirebaseΞΫηεใΛه͢Δ
Vue.jsΛॻ͘ • FirebaseॳظԽॲཧΛॻ͘ • ϩάΠϯɾϩάΞτͷॲཧΛॻ͘ • ϝοηʔδΛૹ৴͢ΔॲཧΛॻ͘ • ϝοηʔδΛඳը͢ΔॲཧΛॻ͘
νϟοτը໘
DBͷத
όοΫΤϯυ͕ͳ͍ ѹతʹָɺߴ͍ ※όοΫΤϯυ͖ͳͷͰσΟεͬͯΔΘ͚Ͱͳ͍
·ͱΊ
• FirebaseόοΫΤϯυͷΠϯϑϥߏஙෆཁ • FirebaseͬͨϦΞϧλΠϜॲཧͷָ࣮͕ • σʔλͷ࣋ͪํ͓͠Ζ͍ • Firebaseʹଞʹ৭Μͳػೳ͕͋ΔͷͰͬͯΈ͍ͨ ·ͱΊ
Firebaseͦͷଞͷٕज़ ใΛڞ༗͠߹͍·͠ΐ͏
ࢀߟURL • ϦΞϧλΠϜͳwebΞϓϦΛ࣮ݱ͢Δํ๏(ϙʔϦϯάɺ CometɺServer Sent EventsɺWebSocket) ‣ https://qiita.com/kimullaa/items/d49bd603be17b36f7495 • جૅ͔ΒֶͿVue.js
‣ https://cr-vue.mio3io.com