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
ありがとう、create-react-app
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
utagawa kiki
January 12, 2024
Programming
12k
4
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ありがとう、create-react-app
ToKyoto.js #02
https://kyotojs.connpass.com/event/302442/
utagawa kiki
January 12, 2024
More Decks by utagawa kiki
See All by utagawa kiki
メソッドのジェネリクスでGoの夢は広がるか? / Kyoto.go #65
utgwkk
3
1.1k
new(1.26) ← これすき / kamakura.go #8
utgwkk
0
4.3k
tparseでgo testの出力を見やすくする
utgwkk
2
2k
go test -json そして testing.T.Attr / Kyoto.go #63
utgwkk
4
2.5k
自動で //nolint を挿入する取り組み / Gopher's Gathering
utgwkk
1
3.2k
ゆるやかにgolangci-lintのルールを強くする / Kyoto.go #56
utgwkk
2
4.5k
君たちはどうコードをレビューする (される) か / 大吉祥寺.pm
utgwkk
21
17k
Dive into gomock / Go Conference 2024
utgwkk
14
8.7k
Goでリフレクションする、その前に / Kansai.go #1
utgwkk
4
3.8k
Other Decks in Programming
See All in Programming
AIを活用したE2Eテスト実装効率化のあゆみ / ebisu-mobile-14-kotetu
kotetuco
0
180
Go言語とトイモデルで学ぶTransformerの気持ち / fukuokago23-transformer
monochromegane
0
140
フィードバックで育てるAI開発
kotaminato
1
120
「正の参照」と 「負の導出」で組む ハーネスエンジニアリング
cottpan
1
150
OSINT for SRE: 学術論文とポストモーテムから探る システム障害の共通パターン / SRE NEXT 2026
tomoyk
1
4.1k
AI時代の仕事技芸論〜ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ(スクフェス仙台 2026バージョン)
kuranuki
0
680
Generative UI & AI-Assistants for Your Angular Solutions
manfredsteyer
PRO
1
210
ランチタイムLT会3周年!ランチタイムLT会を3年間続けられたお話
y0hgi
1
150
なぜ関数型プログラミングで「型」と「証明」が語られるのか #fp_matsuri
kajitack
3
990
初めてのKubernetes 本番運用でハマった話
oku053
0
130
これからAgentCoreを触る方へトレンドはGatewayです
har1101
6
500
PHP に部分適用が来るぞ!……ところで何それ?おいしいの? #phpcon / phpcon-2026
shogogg
0
320
Featured
See All Featured
The Curious Case for Waylosing
cassininazir
1
440
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.4k
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
260
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
220
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
770
Skip the Path - Find Your Career Trail
mkilby
1
170
Ten Tips & Tricks for a 🌱 transition
stuffmc
0
150
Ethics towards AI in product and experience design
skipperchong
2
330
Measuring & Analyzing Core Web Vitals
bluesmoon
9
900
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
akademiya2063
PRO
1
180
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
201
75k
Transcript
ありがとう、create-react-app ToKyoto.js #02 @utgwkk (うたがわきき)
はじめに 今日はcreate-react-appに感謝を伝えに来ました
自己紹介 @utgwkk (うたがわきき) 株式会社はてな Webアプリケーションエンジニア in 京都 KMC (京大マイコンクラブ) 最近はGoとReactを書いて暮らしています
アジェンダ create-react-appについて create-react-appの現状 create-react-appと私
アジェンダ create-react-appについて create-react-appの現状 create-react-appと私
create-react-app https://create-react-app.dev/ コマンドを1つ実行するだけで Reactを使ったアプリケーションの開発が できるようになる Webpackの設定や各種ライブラリ・ スクリプトの詰め合わせ
ゼロコンフィグ最高便利 何も設定を書かなくてもReactがすぐ使える (ほぼ) 何もしなくてもTypeScript/Sass/CSS Modulesが使える Webpack/Babel/Jestなどの設定を忘れて書きはじめられる 最高便利〜
アジェンダ create-react-appについて create-react-appの現状 create-react-appと私
create-react-appの現状 (最終更新日時) 2022/8/13にv5.0.1がリリースされている https://github.com/facebook/create-react-app/releases/tag/v5.0.1 React 18向けの互換性対応が主
create-react-appの現状 (メンテナ不足) We need regualr CRA maintainer · Issue #11180
· facebook/create-react-app
create-react-appの現状 (チュートリアル) 最新のReact公式チュートリアルで紹介されているフレームワークは以下 • Next.js • Remix • Gatsby •
Expo そもそもフレームワークの利用が前提として書いてある ViteやParcelを使う選択肢は発展編として出てくる
create-react-appは役目を終えた? 「Create React Appは役割を終えました」 https://zenn.dev/nekoya/articles/dd0f0e8a2fa35f 公式チュートリアルから案内されなくなっている Reactがフレームワーク指向っぽくなっているのもあるか?
アジェンダ create-react-appについて create-react-appの現状 create-react-appと私
ゼロコンフィグという気軽さ コマンド1つ叩くだけでReactが使える フロントエンドのツールチェインのことを気にせずにReactが書ける おもちゃから本格的なアプリケーションまで作った
不具合調査・動作検証 挙動調査のためにサクッとcreate-react-appで書きはじめる https://github.com/utgwkk/20210719-sketch-react-modal-vs-mouseevent https://github.com/utgwkk/20210710-sketch-use-measure-and-animation https://github.com/utgwkk/20221117-sketch-react-modal https://github.com/utgwkk/20221206-sketch-cra-env-var-name
作ったおもちゃの例 https://sugarheart.utgw.net/wordlenator/ 我々がWordleを出題してAIに解いてもらう Wordleの単語を当ててもらう側を無限に体験できる Wordlenatorを作った - 私が歌川です
作ったアプリケーションの例 https://github.com/kmc-jp/GodUploader-graphql サークル (KMC) で使っている部内イラストアップローダー React / React Router /
Relay (GraphQL)
None
None
None
create-react-appの薄い本 create-react-appにお世話になったので 同人誌を書く create-react-appが使っているライブラリや 実装について知る本 https://utgwkk.booth.pm/items/4069689
ヤンチャの思い出 create-react-appで生成した環境でejectせずにWebpackのプラグインを試したい - 私 が歌川です 中身がWebpackだと分かっているので様々なズルを試す
create-react-appからツールチェーンに親しむ もともとフロントエンドツールチェーンについて何も知らなかった scriptタグでJSファイルを読み込むところからなかなか進展せず数年 新卒入社してから本格的にReactを書きはじめた create-react-appをきっかけに、多少は何が起こっているのか分かるようになったつもり フロントエンドの世界に臆せず飛び込めるようになった
after create-react-appと私 おそらくもうcreate-react-appを新規採用しないだろう 簡単なReactアプリケーションを作りたくなったらViteを使う create-react-appで作ったアプリケーションをViteに移行したことがある 世間的にはNext.jsが流行っている??
おわりに ありがとう、create-react-app フロントエンドの世界に飛び込むきっかけを作ってくれてありがとう