Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Gatsbyお試し
Search
ponday
January 25, 2019
Programming
150
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.7k
TypeScriptの型表現
honda
10
3.2k
Web Componentsの今
honda
1
480
これまでのReact、これからのReact
honda
0
350
styled-components or emotion?
honda
0
730
Web ComponentsとAngular
honda
0
160
Atomic Design周りについての私見
honda
1
820
え、まだWeb Componentsを未来の技術だと思ってるの?
honda
2
890
Web Componentsの動向とPolymer
honda
4
2.8k
Other Decks in Programming
See All in Programming
Next.js: The final boss of Web Performance
guaca
0
180
外から家のPCの電源入れたい!をPHPで解決する
kawashimo0
1
130
mrbgem 三角測量 開発
ogom
0
250
全ての永続トークンを、生まれる前に消し去りたい!
sylph01
2
600
JIS keyboard support in Omarchy
lef237
0
100
SalesForceを内製化!? ~ HR事業を支える顧客管理基盤のインフラを大公開 ~
oku053
0
170
[Rails World 2026] Durable orchestration on Rails: from continuation to workflow
palkan
1
740
dotNET_vulnclicker_intro.pdf
deka_morita
0
140
見えないものを探る要求要件定義に必要な基本的思考 / invisible-requirement-thinking
minodriven
15
8.4k
3回つくってわかった、 定期実行ジョブ基盤の本質情報
takai
0
340
KiroのSpecで「五目並べ」を作ってみる
satoshi256kbyte
1
380
contenteditable と日本語入力に向き合う
colorful12
0
200
Featured
See All Featured
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.9k
Product Roadmaps are Hard
iamctodd
55
13k
Heart Work Chapter 1 - Part 1
lfama
PRO
10
37k
My Coaching Mixtape
mlcsv
0
350
Producing Creativity
orderedlist
PRO
348
41k
The Limits of Empathy - UXLibs8
cassininazir
2
720
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.3k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
35
2.9k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
270
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Principles of Awesome APIs and How to Build Them.
keavy
128
18k
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
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 !!