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
110
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.1k
TypeScriptの型表現
honda
10
3k
Web Componentsの今
honda
1
390
これまでのReact、これからのReact
honda
0
290
styled-components or emotion?
honda
0
640
Web ComponentsとAngular
honda
0
130
Atomic Design周りについての私見
honda
1
630
え、まだWeb Componentsを未来の技術だと思ってるの?
honda
2
740
Web Componentsの動向とPolymer
honda
4
2.4k
Other Decks in Programming
See All in Programming
HTTP compression in PHP and Symfony apps
dunglas
2
1.7k
KubeCon + CloudNativeCon NA 2024 Overviewat Kubernetes Meetup Tokyo #68 / amsy810_k8sjp68
masayaaoyama
0
250
コンテナをたくさん詰め込んだシステムとランタイムの変化
makihiro
1
120
モバイルアプリにおける自動テストの導入戦略
ostk0069
0
110
SymfonyCon Vienna 2025: Twig, still relevant in 2025?
fabpot
3
1.2k
命名をリントする
chiroruxx
1
390
RWC 2024 DICOM & ISO/IEC 2022
m_seki
0
210
Асинхронность неизбежна: как мы проектировали сервис уведомлений
lamodatech
0
710
競技プログラミングへのお誘い@阪大BOOSTセミナー
kotamanegi
0
360
Mermaid x AST x 生成AI = コードとドキュメントの完全同期への道
shibuyamizuho
0
160
Go の GC の不得意な部分を克服したい
taiyow
2
770
急成長期の品質とスピードを両立するフロントエンド技術基盤
soarteclab
0
930
Featured
See All Featured
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
95
17k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
0
97
Music & Morning Musume
bryan
46
6.2k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
6
510
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
26
1.9k
Fashionably flexible responsive web design (full day workshop)
malarkey
405
66k
YesSQL, Process and Tooling at Scale
rocio
169
14k
Done Done
chrislema
181
16k
GraphQLとの向き合い方2022年版
quramy
44
13k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
38
1.9k
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 !!