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
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
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
330
styled-components or emotion?
honda
0
710
Web ComponentsとAngular
honda
0
150
Atomic Design周りについての私見
honda
1
780
え、まだWeb Componentsを未来の技術だと思ってるの?
honda
2
880
Web Componentsの動向とPolymer
honda
4
2.7k
Other Decks in Programming
See All in Programming
AI時代でも変わらない技術コミュニティの力~10年続く“ゆるい”つながりが生み出す価値
n_takehata
2
430
並行開発のためのコードレビュー
miyukiw
2
2k
個人開発は儲からない - それでも開発開始1ヶ月で300万円売り上げた方法
taishiyade
0
110
AWS Infrastructure as Code の新機能 2025 総まとめ~ SA 4人による怒涛のデモ祭り ~
konokenj
8
1.5k
Claude Code、ちょっとした工夫で開発体験が変わる
tigertora7571
0
170
Python’s True Superpower
hynek
0
190
[KNOTS 2026登壇資料]AIで拡張‧交差する プロダクト開発のプロセス および携わるメンバーの役割
hisatake
0
350
その「common」ディレクトリ、腐っていませんか?
kinocoboy2
1
110
atmaCup #23でAIコーディングを活用した話
ml_bear
4
680
Event Storming
hschwentner
3
1.3k
Agent Skills Workshop - AIへの頼み方を仕組み化する
gotalab555
12
6.6k
AI時代の認知負荷との向き合い方
optfit
0
180
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
340
58k
Context Engineering - Making Every Token Count
addyosmani
9
680
Code Review Best Practice
trishagee
74
20k
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
2.4k
The Cult of Friendly URLs
andyhume
79
6.8k
Navigating Weather and Climate Data
rabernat
0
120
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
85
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
92
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
akademiya2063
PRO
1
65
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4k
Producing Creativity
orderedlist
PRO
348
40k
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 !!