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
ponday
January 25, 2019
Programming
0
120
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.2k
TypeScriptの型表現
honda
10
3.1k
Web Componentsの今
honda
1
430
これまでのReact、これからのReact
honda
0
310
styled-components or emotion?
honda
0
680
Web ComponentsとAngular
honda
0
130
Atomic Design周りについての私見
honda
1
700
え、まだWeb Componentsを未来の技術だと思ってるの?
honda
2
820
Web Componentsの動向とPolymer
honda
4
2.6k
Other Decks in Programming
See All in Programming
システム成長を止めない!本番無停止テーブル移行の全貌
sakawe_ee
1
160
地方に住むエンジニアの残酷な現実とキャリア論
ichimichi
5
1.5k
既存デザインを変更せずにタップ領域を広げる方法
tahia910
1
270
Is Xcode slowly dying out in 2025?
uetyo
1
250
童醫院敏捷轉型的實踐經驗
cclai999
0
210
ISUCON研修おかわり会 講義スライド
arfes0e2b3c
0
300
20250704_教育事業におけるアジャイルなデータ基盤構築
hanon52_
5
400
『自分のデータだけ見せたい!』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
akitotsukahara
2
610
NPOでのDevinの活用
codeforeveryone
0
720
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
okashoi
1
220
「Cursor/Devin全社導入の理想と現実」のその後
saitoryc
0
700
設計やレビューに悩んでいるPHPerに贈る、クリーンなオブジェクト設計の指針たち
panda_program
6
1.8k
Featured
See All Featured
How GitHub (no longer) Works
holman
314
140k
It's Worth the Effort
3n
185
28k
Testing 201, or: Great Expectations
jmmastey
42
7.6k
Unsuck your backbone
ammeep
671
58k
The Language of Interfaces
destraynor
158
25k
Facilitating Awesome Meetings
lara
54
6.4k
Designing for Performance
lara
609
69k
Agile that works and the tools we love
rasmusluckow
329
21k
Making Projects Easy
brettharned
116
6.3k
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
A designer walks into a library…
pauljervisheath
207
24k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
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 !!