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お試し
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
ponday
January 25, 2019
Programming
0
130
Gatsbyお試し
React勉強会@福岡 vol.1(2019/01/25)の発表資料2つめです。
ponday
January 25, 2019
Tweet
Share
More Decks by ponday
See All by ponday
関数型でGoFのデザインパターンやってみる
honda
1
1.6k
TypeScriptの型表現
honda
10
3.1k
Web Componentsの今
honda
1
460
これまでのReact、これからのReact
honda
0
320
styled-components or emotion?
honda
0
710
Web ComponentsとAngular
honda
0
140
Atomic Design周りについての私見
honda
1
770
え、まだWeb Componentsを未来の技術だと思ってるの?
honda
2
870
Web Componentsの動向とPolymer
honda
4
2.7k
Other Decks in Programming
See All in Programming
Lambda のコードストレージ容量に気をつけましょう
tattwan718
0
130
[KNOTS 2026登壇資料]AIで拡張‧交差する プロダクト開発のプロセス および携わるメンバーの役割
hisatake
0
280
【卒業研究】会話ログ分析によるユーザーごとの関心に応じた話題提案手法
momok47
0
200
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
nrslib
2
1.9k
AWS re:Invent 2025参加 直前 Seattle-Tacoma Airport(SEA)におけるハードウェア紛失インシデントLT
tetutetu214
2
110
Package Management Learnings from Homebrew
mikemcquaid
0
220
AIフル活用時代だからこそ学んでおきたい働き方の心得
shinoyu
0
130
Patterns of Patterns
denyspoltorak
0
1.4k
高速開発のためのコード整理術
sutetotanuki
1
400
ぼくの開発環境2026
yuzneri
0
230
AtCoder Conference 2025
shindannin
0
1.1k
余白を設計しフロントエンド開発を 加速させる
tsukuha
7
2.1k
Featured
See All Featured
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
710
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.6k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
34k
Amusing Abliteration
ianozsvald
0
100
sira's awesome portfolio website redesign presentation
elsirapls
0
150
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
170
The Language of Interfaces
destraynor
162
26k
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
55
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Darren the Foodie - Storyboard
khoart
PRO
2
2.4k
The untapped power of vector embeddings
frankvandijk
1
1.6k
Transcript
Gatsbyお試し React勉強会@福岡 vol.1 / Jan 25th, 2019 ponday (@ponday_dev)
Profile - ponday (Honda, Yusuke) - 株式会社ベガコーポレーション エンジニア - Like
: TypeScript / Elixir / Python etc… - 日曜フロントエンドエンジニア - 副業もやってます
突然ですが
福岡市、 インフルエンザ 流行ってますね
Gatsbyの発表がキャンセルになってしまったので Gatsbyの話します
Gatsby
Gatsby - React製の静的サイトジェネレータ - 豊富なプラグインによる高い拡張性 - 組み込みでGraphQL - ReactのHPもGatsbyを使ってるらしい -
ググラビリティ△
チュートリアルやりなおした
触ってみた感想 - (標準から外れないかぎり)簡単 - ルーティングの面倒を見なくて良いのはすごく楽 - JSファイル名 = URL -
コンポーネント部分は普通のReact - 普通のReactなので結構好き勝手やれる - Reactのバージョンを上げてしまえばHooksも動いた
気になった点 - Markdown配信までが意外と面倒 - そもそもチュートリアルがMarkdown配信するまでの道のり - まだ日本語情報少ない(古いバージョンとか) - プラグインの選択が重要になりそう -
すごい数ある - 手作業でもやれるけど、手数がまったく違う
おまけ
無意識でTypeScript用テンプレート作ってた
TypeScript化の手順 - gatsby-plugin-typescriptを入れる - gatsby-config.jsでプラグインを読み込む - TypeScript関連のモジュールを入れる - @types/{node,react,react-dom} -
typescript - tsconfig.jsonを書く
これだけ
動くの確認用にまたチュートリアルやった
これでGatsbyもTypeScriptで作れる!!
だけど......
None
Thank you !!