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
Gatsby + Netlifyで ポートフォリオサイトを 作った話
Search
starfish719
July 28, 2019
Programming
0
78
Gatsby + Netlifyで ポートフォリオサイトを 作った話
starfish719
July 28, 2019
Tweet
Share
More Decks by starfish719
See All by starfish719
開発生産性を上げるための生成AI活用術
starfish719
1
110
ファインディ株式会社におけるMCP活用とサービス開発
starfish719
0
3.2k
ファインディ株式会社における生成AI活用までの軌跡
starfish719
1
3.5k
ファインディの テックブログ爆誕までの軌跡
starfish719
3
3.2k
動作確認やテストで漏れがちな観点3選
starfish719
6
1.5k
GitHub CopilotでTypeScriptの コード生成するワザップ
starfish719
28
6.8k
Findyの爆速開発を支えるPull requestの粒度
starfish719
0
4.8k
フロントエンドの設計刷新〜決断から効果検証まで〜
starfish719
0
62
開発生産性実践入門 Pullrequestの粒度編
starfish719
0
1.8k
Other Decks in Programming
See All in Programming
NetworkXとGNNで学ぶグラフデータ分析入門〜複雑な関係性を解き明かすPythonの力〜
mhrtech
3
920
麻雀点数計算問題生成タスクから学ぶ Single Agentの限界と Agentic Workflowの底力
po3rin
5
2k
XP, Testing and ninja testing ZOZ5
m_seki
1
150
AIで開発生産性を上げる個人とチームの取り組み
taniigo
0
130
開発者への寄付をアプリ内課金として実装する時の気の使いどころ
ski
0
330
(Extension DC 2025) Actor境界を越える技術
teamhimeh
1
170
プログラミングどうやる? ~テスト駆動開発から学ぶ達人の型~
a_okui
0
190
AIを活用したレシート読み取り機能の開発から得られた実践知 / AI Receipt Scan Practice
rockname
2
1.5k
defer f()とdefer fの挙動を 誤解していた話
kogamochiduki
2
160
Breaking Up with Big ViewModels — Without Breaking Your Architecture (droidcon Berlin 2025)
steliosf
PRO
1
280
Reactをクライアントで使わない
yusukebe
7
6.3k
Advance Your Career with Open Source
ivargrimstad
0
240
Featured
See All Featured
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.7k
Agile that works and the tools we love
rasmusluckow
330
21k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
570
Large-scale JavaScript Application Architecture
addyosmani
513
110k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
36
2.5k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
188
55k
Into the Great Unknown - MozCon
thekraken
40
2.1k
Docker and Python
trallard
46
3.6k
Transcript
Gatsby + NetlifyͰ ϙʔτϑΥϦΦαΠτΛ ࡞ͬͨ
ࣗݾհ • ށా ઍ൏ (Toda Chihaya) • @starfish0206 • ϕΨίʔϙϨʔγϣϯ
• PHP JavaScript Swift • Vue.js Elixir • झຯɹϙέϞϯ • ಛٕɹϙέϞϯ
ࠓ͢͜ͱ • GatsbyΛͬͯ؆୯ʹαΠτߏங • NetlifyΛͬͯ؆୯ʹαΠτެ։
ࠓ͞ͳ͍͜ͱ • ϙέϞϯ • ;Δ͞ͱೲ੫ • ΏΔΩϟϯ˚
͖ͬͯ • ΞτϓοτΛ͍ͬͯ͜͏ • Qiitaͱ͔Mediumͱ͔όϥ͚ΔͷΊΜͲ͍ • ࣗͷϙʔτϑΥϦΦαΠτΛ࣋ͬͯΕղ ܾ
Ͳ͏ͬͯ࡞Δʁ
Gatsby • αΠτΛ࡞Δ͜ͱͰͳ͘ɺܧଓͯ͠Ξτϓο τ͢ΔΛ࡞Δ͜ͱ͕త • Ξτϓοτ͢Δͷӡ༻ʹίετΛ͔͚Δͷ φϯηϯε • ੩తαΠτδΣωϨʔλ͕γϯϓϧͰӡ༻؆୯ •
ReactͷGatsbyΛ࠾༻
Netlify • ϦϙδτϦʹpushͨ͠ΒࣗಈతʹσϓϩΠ • Ϗϧυ࣌ʹڥมΛར༻Մೳ • ͓͔͚ۚͨ͘ͳ͍ • શͯͷ݅Λຬͨ͢NetlifyͰܾఆ
Gatsby
ॳظઃఆ • npm install -g gatsby-cli • GatsbyͷStarter͔Βɺࢀߟʹ͢ΔαϯϓϧαΠτ Λ୳͢ •
gatsby new NEW_SITE_DIRECTORY_FOR_YOUR_SITE https://github.com/CREATER_NAME/ REPO_NAME.git
ॾʑमਖ਼ • σβΠϯCSSΛΈʹௐ • αϯϓϧهࣄΛআ • og:imagefaviconɺdescriptionͳͲΛमਖ਼
هࣄΛॻ͘ • ϚʔΫμϯͰهࣄΛ࡞ • ҎԼͷΑ͏ͳλάΛϑΝΠϧͷઌ಄ʹஔ͢Δ͜ͱͰɺ GraphQLܦ༝ͰσʔλΛऔಘ͢Δ͜ͱ͕ՄೳʹͳΔ --- title: αϯϓϧλΠτϧ category:
"Gatsby" cover: cover.png author: starfish --- •
Netlify
ॳظઃఆ • GitHubͱ࿈ܞͤͯ͞ɺը໘ϙνϙν͢Δ͚ͩ
None
·ͱΊ • GatsbyͷStarterΊͬͪΌศར • Netlify૾͍ͯͨ͠100ഒ؆୯ • ϚʔΫμϯͷ͓͔͛ͰɺهࣄΛॻ͘ϋʔυϧ͕Լ͕ͬͨ • ܧଓͯ͠Ξτϓοτ͢Δͱ͍͏తʹదͨ͠બͩͬͨ •
ৄࡉ https://starfish719.netlify.com/ Λࢀর