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
VuePress x Firebaseでエンジニアブログを作ってみた話
Search
GcNok
September 25, 2019
Programming
0
4.8k
VuePress x Firebaseでエンジニアブログを作ってみた話
GcNok
September 25, 2019
Tweet
Share
More Decks by GcNok
See All by GcNok
GatsbyJS + Contentful + Netlifyで作る技術ブログ
gcnok
0
4.9k
Other Decks in Programming
See All in Programming
AWS Application Composerで始める、 サーバーレスなデータ基盤構築 / 20240406-jawsug-hokuriku-shinkansen
kasacchiful
1
250
オブジェクト指向のリ・オリエンテーション~歴史を振り返り、AI時代に向きなおる~
hanyudaeiiti
10
5.6k
What We Can Learn From OSS
inouehi
0
400
GraphQLサーバの構成要素を整理する #ハッカー鮨 #tsukijigraphql / graphql server technology selection
izumin5210
0
110
SpringBoot+MyBatisで例外が出たときどこを見るか
syukai
0
110
Hanami and htmx
bkuhlmann
0
190
#phpcon_odawara オープン・クローズドなテストフィクスチャを求めて / open closed test fixtures
77web
3
220
SwiftUI Performance 不要なViewの再描画と更新を抑える
bigamitiongit
1
160
Git Rebase
bkuhlmann
11
1.6k
Front-end application development, Symfony-style(s)
dunglas
2
1.9k
try! Swift Tokyo 初参加報告LT
hinakko2
0
190
"config" ってなんだ? / What is "config"?
okashoi
0
220
Featured
See All Featured
Being A Developer After 40
akosma
56
580k
The Power of CSS Pseudo Elements
geoffreycrofte
59
5k
Automating Front-end Workflow
addyosmani
1355
200k
The Illustrated Children's Guide to Kubernetes
chrisshort
29
46k
No one is an island. Learnings from fostering a developers community.
thoeni
14
2.1k
Into the Great Unknown - MozCon
thekraken
10
980
What's new in Ruby 2.0
geeforr
337
31k
jQuery: Nuts, Bolts and Bling
dougneiner
59
7.1k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
9
8.3k
YesSQL, Process and Tooling at Scale
rocio
163
13k
Making the Leap to Tech Lead
cromwellryan
123
8.5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
119
38k
Transcript
VuePress x FirebaseͰ ΤϯδχΞϒϩάΛ࡞ͬͯΈͨ גࣜձࣾεϚʔτγϣοϐϯάɹࢤ࣏ق
ࣗݾհ • ໊લɿࢤ࣏قʢ@GcNok2ʣ • ୲ɿECγϣοϓͷՁ֨ൺֱαΠτͷ։ൃ • ։ൃݴޠɿVueɺAngularɺPHPɺGo • ೖࣾ࣌ظɿ20192݄
࣍ • ΤϯδχΞϒϩάΛ࡞͖͔͚ͬͨͬ • VuePressͱʁ • Firebaseͱʁ • σϞ •
ॴײʢVuePressͷϝϦοτɺσϝϦοτʣ • ·ͱΊ
ΤϯδχΞϒϩάΛ࡞͖͔͚ͬͨͬ • ݸਓతʹVuePressʹ৮ͬͯΈ͔ͨͬͨͨΊ • ࣾͰίʔϙϨʔταΠτΛվमதͰɺΤϯδχΞϒϩάΛ։ ઃ༧ఆͷͨΊɺαϯϓϧͰ࡞ͬͯΈΑ͏ͱࢥͬͨͨΊ
VuePressͱʁ • VueʹΑΔ੩తαΠτδΣωϨʔλ • Markdown ʹΑΔϖʔδͷ࡞͕ՄೳͰɺٕज़ܥυΩϡϝϯτ ͷ࡞ʹ࠷దԽ͞ΕͨςʔϚ͕σϑΥϧτͰ༻ҙ͞Ε͍ͯΔ • VueͰ࡞͞Ε͍ͯΔͨΊɺVueίϯϙʔωϯτʹΑͬͯϖʔδ ͷΧελϜՄೳ
VuePressͷػೳ • σϑΥϧτςʔϚ ɾϨεϙϯγϒϨΠΞτ ɾϔομʔͰͷهࣄݕࡧ ɾΧελϚΠζՄೳͳφϏόʔɺαΠυόʔ • Markdown ෦͔ΒVueίϯϙʔωϯτͷݺͼग़͕͠Մೳ •
Progressive Web ApplicationʢPWAʣͷαϙʔτ
Firebaseͱʁ • Google ͕ఏڙ͍ͯ͠ΔϞόΠϧ͓Αͼ Web ΞϓϦέʔγϣϯ ͷόοΫΤϯυαʔϏεʢmBaaSʣ • ͘͢ߴ࣭ͷϞόΠϧΞϓϦΛ։ൃ͢Δ͜ͱ͕Ͱ͖Δϓϥο τϑΥʔϜͰɺ։ൃʹཱͭ൚༻తͳػೳ͕༻ҙ͞Ε͍ͯΔ
• ೝূػೳ؆қతͳσʔλϕʔεʢNoSQLʣɺετϨʔδɺ ϗεςΟϯάͳͲ
͜ΜͳΠϝʔδ
ࠓճFirebase Hosting͚ͩΛͬͯ·͢
Firebase Hostingͱʁ • 1 ͭͷίϚϯυͰ৽͍͠όʔδϣϯΛσϓϩΠ • Ξοϓϩʔυͨ͠ϑΝΠϧCDNͰΩϟογϡ͞ΕΔ • ཧը໘͔ΒϫϯΫϦοΫͰϩʔϧόοΫͰ͖Δ
σϞ
ॴײʢϝϦοτʣ • HTMLɺCSSΛ΄ͱΜͲॻ͔ͣʹ؆୯ͳυΩϡϝϯταΠτ͕ߏஙͰ͖ ͨ • 1هࣄ1ϚʔΫμϯͰϑΝΠϧ͕ཧ͞Ε͍ͯΔͷͰɺهࣄͷՃ؆ ୯ • Vueͷࣝ͑͋͞Εɺ؆୯ʹΧελϜͰ͖Δ •
ΦʔϓϯιʔεͷͨΊແྉ
ॴײʢσϝϦοτʣ • ࠷ॳ͔Β΄ͱΜͲελΠϧ͕ܾ·͍ͬͯΔͨΊɺେ෯ʹσβΠϯ Λมߋ͍ͨ͠߹ʹෆ͖ • هࣄΛϑΝΠϧͰཧ͍ͯ͠ΔͨΊɺ૿͑͗͢Δͱཧ͕େมʹ ͳΔ • هࣄΛߋ৽͢ΔͨͼʹGitʹίϛοτͨ͠Γɺαʔόʔʹσϓϩ Π͕ඞཁʹͳΔ
·ͱΊ • VuePressσϑΥϧτͰϨεϙϯγϒʹରԠ͍ͯͯ͠ɺݕࡧػೳ ༻ҙ͞Ε͍ͯΔͨΊɺΧελϜ͠ͳͯͦ͘ΕͳΓͷWebϖʔ δΛ࡞͢Δ͜ͱ͕Ͱ͖Δ • ֶशίετ͘ɺݸਓͰ؆୯ͳυΩϡϝϯταΠτΛߏஙͨ͠ ͍ͱࢥ͍ͬͯΔํʹΦεεϝ
Thank you!!!