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
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
ponday
January 25, 2019
Programming
140
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Gatsbyお試し
React勉強会@福岡 vol.1(2019/01/25)の発表資料2つめです。
ponday
January 25, 2019
More Decks by ponday
See All by ponday
関数型でGoFのデザインパターンやってみる
honda
1
1.6k
TypeScriptの型表現
honda
10
3.1k
Web Componentsの今
honda
1
480
これまでのReact、これからのReact
honda
0
340
styled-components or emotion?
honda
0
720
Web ComponentsとAngular
honda
0
160
Atomic Design周りについての私見
honda
1
800
え、まだWeb Componentsを未来の技術だと思ってるの?
honda
2
880
Web Componentsの動向とPolymer
honda
4
2.7k
Other Decks in Programming
See All in Programming
[2026年度第1回ORセミナー] 計画最適化ベンチャーと競技プログラミング人材
terryu16
0
250
Make SRE Operations Easier with Azure SRE Agent
kkamegawa
0
5k
AIで効率化できた業務・日常
ochtum
0
120
LLM Plugin for Node-REDの利用方法と開発について
404background
0
170
メソッドのジェネリクスでGoの夢は広がるか? / Kyoto.go #65
utgwkk
3
650
過去最大のMCPアップデート! 2026-07-28 RC版の謎に迫る
licux
6
210
キャリア迷子上等 ─ "ない道"は自分で作ればいい
16bitidol
3
1.9k
CSC307 Lecture 17
javiergs
PRO
0
320
Java × distroless で 軽量なコンテナイメージを / Java on Distroless
contour_gara
0
510
OSもどきOS
arkw
0
470
Swiftのレキシカルスコープ管理
kntkymt
0
220
DynamoDBには集計系のクエリがないけどなんとかしたい
musan
1
130
Featured
See All Featured
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
55k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.8k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
330
Designing for humans not robots
tammielis
254
26k
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.2k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.4k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
25k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.4k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
250
It's Worth the Effort
3n
188
29k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
250
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 !!