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
GatsbyJS + Contentful + Netlifyで作る技術ブログ
Search
GcNok
October 22, 2019
Technology
0
5.2k
GatsbyJS + Contentful + Netlifyで作る技術ブログ
GcNok
October 22, 2019
Tweet
Share
More Decks by GcNok
See All by GcNok
VuePress x Firebaseでエンジニアブログを作ってみた話
gcnok
0
5k
Other Decks in Technology
See All in Technology
Transformerを用いたアイテム間の 相互影響を考慮したレコメンドリスト生成
recruitengineers
PRO
2
440
サイバーエージェントグループのSRE10年の歩みとAI時代の生存戦略
shotatsuge
4
1k
AIでテストプロセス自動化に挑戦する
sakatakazunori
1
530
スタックチャン家庭用アシスタントへの道
kanekoh
0
120
VS CodeとGitHub Copilotで爆速開発!アップデートの波に乗るおさらい会 / Rapid Development with VS Code and GitHub Copilot: Catch the Latest Wave
yamachu
3
460
推し書籍📚 / Books and a QA Engineer
ak1210
0
140
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
2.7k
データ戦略部門 紹介資料
sansan33
PRO
1
3.3k
LIXIL基幹システム刷新に立ち向かう技術的アプローチについて
tsukuha
1
380
Talk to Someone At Delta Airlines™️ USA Contact Numbers
travelcarecenter
0
160
TLSから見るSREの未来
atpons
2
310
CDKコード品質UP!ナイスな自作コンストラクタを作るための便利インターフェース
harukasakihara
2
240
Featured
See All Featured
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
Code Review Best Practice
trishagee
69
19k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Why Our Code Smells
bkeepers
PRO
337
57k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
A Modern Web Designer's Workflow
chriscoyier
695
190k
The Invisible Side of Design
smashingmag
301
51k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
282
13k
RailsConf 2023
tenderlove
30
1.1k
Music & Morning Musume
bryan
46
6.7k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.5k
Transcript
GatsbyJS + Contentful + NetlifyͰ࡞Δٕज़ϒϩά גࣜձࣾεϚʔτγϣοϐϯάɹࢤ࣏ق
ࣗݾհ • ໊લɿࢤ࣏قʢ@gc_tech70ʣ • ॴଐɿגࣜձࣾεϚʔτγϣοϐϯά • ։ൃݴޠɿVue, Nuxt.js, Angular, Go,
PHP • ϚΠϒʔϜɿFlutter։ൃ
࣍ • ٕज़ϒϩάΛ࡞͖͔͚ͬͨͬ • GatsbyJSͱʁ • Contentfulͱʁ • Netlifyͱʁ •
σϞ • ·ͱΊ
ٕज़ϒϩάΛ࡞͖͔͚ͬͨͬ • ReactͰԿ͔࡞ͬͯΈ͔ͨͬͨ • GraphQLΛͬͯΈ͔ͨͬͨ • NetlifyΛͬͯΈ͔ͨͬͨ • ؔ࿈ٕज़Ͱ͋ΔVuePressͱͷҧ͍ΛΓ͔ͨͬͨ
GatsbyJSͱʁ • React.jsϕʔεͷ੩తαΠτδΣωϨʔλʔ • ϞμϯͳWebٕज़Λखܰʹ༻Ͱ͖ɺߴͳWebϖʔδΛ ࣮ݱՄೳ • PWAɺSSRɺGraphQLͳͲ • 1000छྨͷpluginͰΧελϚΠζੑ͕ߴ͍
ͱʹ͔͍͘Β͍͠
LighthouseͰύϑΥʔϚϯεΛݕূ
None
͍ʢ֬৴ʣ
Contentfulͱʁ • ϔουϨεCMSͷ1ͭͰɺWordPressͳͲͱҟͳΓɺAPIϕʔ εͰͷهࣄΛఏڙ • ແྉͰϦονͳཧը໘Λ༻Ͱ͖Δɻʢ5000Ϩίʔυ·Ͱʣ • هࣄͷόʔδϣϯཧͳͲՄೳ
None
None
Netlifyͱʁ • ੩తαΠτΛϗεςΟϯά͢Δ͜ͱ͕Ͱ͖ΔWebαʔϏε • ެ։खॱ͕ඇৗʹ؆୯Ͱ3εςοϓ΄ͲͰWebαΠτͷެ։͕ Մೳ • GithubͷpushContentfulͷهࣄͷߋ৽ʹϑοΫͯ͠σϓϩ Π͕Մೳ
None
None
σϞ
·ͱΊ • GraphQLRESTͷAPIʹൺͯɺAPIͷ࣮Λؾʹ͢Δ͜ͱͳࣗ͘༝ʹ σʔλΛऔಘͰ͖ͯศར • Gatsbyଟ༷ͳpluginͱ๛ͳυΩϡϝϯτͰࣗ༝ͳΧελϚΠζ͕ Մೳͳ໘ɺΕΔ͜ͱ͕ଟ͍ͷͰਓʹΑֶͬͯशίετ͕ߴ͍ • NetlifyContentfulͱ࿈ܞͨ͠ΓɺGitͷpushʹ߹ΘͤͯࣗಈͰσϓϩ Πͯ͘͠ΕΔͨΊɺඇৗʹศར
Thank you !!!