Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

GatsbyJS + Contentful + Netlifyで作る技術ブログ

Avatar for GcNok GcNok
October 22, 2019
Technology
5.6k
0

GatsbyJS + Contentful + Netlifyで作る技術ブログ

Avatar for GcNok

GcNok

October 22, 2019

More Decks by GcNok

See All by GcNok
VuePress x Firebaseでエンジニアブログを作ってみた話
Avatar for GcNok gcnok
0
5.5k

Other Decks in Technology

See All in Technology
The seven pitfalls of AI (revised version)
Avatar for Uwe Friedrichsen ufried
0
170
いちAWSエンジニアのAI活用を振り返る #devio2026 / devio osaka 2026 kawahara
Avatar for MasahiroKawahara masahirokawahara
1
310
Oracle Cloud Infrastructure(OCI)：Onboarding Session(はじめてのOCI/Oracle Supportご利⽤ガイド)
Avatar for oracle4engineer oracle4engineer
PRO
3
21k
ビジネスを止めない技術的負債の返済のための戦略とその手法 - 技術的負債と向き合う / Complexity and Simplicity
Avatar for soudai sone soudai
PRO
2
350
10年欲しかった音楽管理アプリを、AIと一緒に作りはじめた
Avatar for log5 judau
1
200
Meet AgentCore Identity Consent Portal
Avatar for iganin hironobuiga
2
150
Swap and Memory Reclaim - Squeezing Out More RAM
Avatar for Kernel Recipes ennael
PRO
1
1.5k
Claude起点の仕様駆動開発
Avatar for 田中 聖也 tanakaseiya
0
280
Mastering Agentic Development: Harness Engineering for Effective Coding Agents
Avatar for Kyosuke Konishi konippi
3
670
人にやさしく、AIにやさしく、書き手を選ばないIaCのガードレール再考 / Rethinking IaC Guardrails for Humans and AI Alike
Avatar for kohbis kohbis
5
2k
生成AIと進める探索的データ分析（2026.10.03 第122回Tokyo.R勉強会）
Avatar for tatamiya tatamiya
0
600
HacobuにおけるFDEとは/登壇資料（戸井田 裕貴）
Avatar for Hacobu hacobu
PRO
1
690

Featured

See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.9k
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
1
480
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
2
2.2k
How Software Deployment tools have changed in the past 20 years
Avatar for Geshan Manandhar geshan
2
34k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
123
22k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
659
62k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
10k
It's Worth the Effort
Avatar for 3n 3n
188
29k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8.3k
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
1
550
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
Avatar for Greg Gifford greggifford
PRO
0
350

Transcript

  1. GatsbyJS + Contentful + NetlifyͰ࡞Δٕज़ϒϩά גࣜձࣾεϚʔτγϣοϐϯάɹࢤ࣏௚ق

  2. ࣗݾ঺հ • ໊લɿࢤ࣏௚قʢ@gc_tech70ʣ • ॴଐɿגࣜձࣾεϚʔτγϣοϐϯά • ։ൃݴޠɿVue, Nuxt.js, Angular, Go,

    PHP • ϚΠϒʔϜɿFlutter։ൃ

  3. ໨࣍ • ٕज़ϒϩάΛ࡞͖͔͚ͬͨͬ • GatsbyJSͱ͸ʁ • Contentfulͱ͸ʁ • Netlifyͱ͸ʁ •

    σϞ • ·ͱΊ

  4. ٕज़ϒϩάΛ࡞͖͔͚ͬͨͬ • ReactͰԿ͔࡞ͬͯΈ͔ͨͬͨ • GraphQLΛ࢖ͬͯΈ͔ͨͬͨ • NetlifyΛ࢖ͬͯΈ͔ͨͬͨ • ؔ࿈ٕज़Ͱ͋ΔVuePressͱͷҧ͍Λ஌Γ͔ͨͬͨ

  5. GatsbyJSͱ͸ʁ • React.jsϕʔεͷ੩తαΠτδΣωϨʔλʔ • ϞμϯͳWebٕज़Λखܰʹ࢖༻Ͱ͖ɺߴ଎ͳWebϖʔδΛ
 ࣮ݱՄೳ • PWAɺSSRɺGraphQLͳͲ • ໿1000छྨͷpluginͰΧελϚΠζੑ͕ߴ͍

  6. ͱʹ͔͘଎͍Β͍͠

  7. LighthouseͰύϑΥʔϚϯεΛݕূ

  8. None

  9. ଎͍ʢ֬৴ʣ

  10. Contentfulͱ͸ʁ • ϔουϨεCMSͷ1ͭͰɺWordPressͳͲͱ͸ҟͳΓɺAPIϕʔ εͰͷهࣄΛఏڙ • ແྉͰϦονͳ؅ཧը໘Λ࢖༻Ͱ͖Δɻʢ5000Ϩίʔυ·Ͱʣ • هࣄͷόʔδϣϯ؅ཧͳͲ΋Մೳ

  11. None
  12. None

  13. Netlifyͱ͸ʁ • ੩తαΠτΛϗεςΟϯά͢Δ͜ͱ͕Ͱ͖ΔWebαʔϏε • ެ։खॱ͕ඇৗʹ؆୯Ͱ3εςοϓ΄ͲͰWebαΠτͷެ։͕ Մೳ • Github΁ͷpush΍Contentfulͷهࣄͷߋ৽ʹϑοΫͯ͠σϓϩ Π͕Մೳ

  14. None
  15. None

  16. σϞ

  17. ·ͱΊ • GraphQL͸RESTͷAPIʹൺ΂ͯɺAPIͷ࣮૷Λؾʹ͢Δ͜ͱͳࣗ͘༝ʹ σʔλΛऔಘͰ͖ͯศར • Gatsby͸ଟ༷ͳpluginͱ๛෋ͳυΩϡϝϯτͰࣗ༝ͳΧελϚΠζ͕ Մೳͳ൓໘ɺ΍ΕΔ͜ͱ͕ଟ͍ͷͰਓʹΑͬͯ͸ֶशίετ͕΍΍ߴ͍ • Netlify͸Contentfulͱ࿈ܞͨ͠ΓɺGitͷpushʹ߹ΘͤͯࣗಈͰσϓϩ Πͯ͘͠ΕΔͨΊɺඇৗʹศར

  18. Thank you !!!