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
400
これまでのReact、これからのReact
honda
0
290
styled-components or emotion?
honda
0
650
Web ComponentsとAngular
honda
0
130
Atomic Design周りについての私見
honda
1
660
え、まだWeb Componentsを未来の技術だと思ってるの?
honda
2
770
Web Componentsの動向とPolymer
honda
4
2.4k
Other Decks in Programming
See All in Programming
SRE、開発、QAが協業して挑んだリリースプロセス改革@SRE Kaigi 2025
nealle
3
4.1k
AWS Organizations で実現する、 マルチ AWS アカウントのルートユーザー管理からの脱却
atpons
0
130
Amazon Bedrock Multi Agentsを試してきた
tm2
1
280
バックエンドのためのアプリ内課金入門 (サブスク編)
qnighy
8
1.7k
AWS Lambda functions with C# 用の Dev Container Template を作ってみた件
mappie_kochi
0
240
最近のVS Codeで気になるニュース 2025/01
74th
1
250
GAEログのコスト削減
mot_techtalk
0
110
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
270
Kanzawa.rbのLT大会を支える技術の裏側を変更する Ruby on Rails + Litestream 編
muryoimpl
0
220
技術を根付かせる / How to make technology take root
kubode
1
240
昭和の職場からアジャイルの世界へ
kumagoro95
1
350
【PHP】破壊的バージョンアップと戦った話〜決断と説得
satoshi256kbyte
0
120
Featured
See All Featured
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.4k
4 Signs Your Business is Dying
shpigford
182
22k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
193
16k
Why Our Code Smells
bkeepers
PRO
335
57k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
RailsConf 2023
tenderlove
29
1k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
12
950
Bash Introduction
62gerente
610
210k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
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 !!