Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ありがとう、create-react-app
Search
utagawa kiki
January 12, 2024
Programming
4
11k
ありがとう、create-react-app
ToKyoto.js #02
https://kyotojs.connpass.com/event/302442/
utagawa kiki
January 12, 2024
Tweet
Share
More Decks by utagawa kiki
See All by utagawa kiki
tparseでgo testの出力を見やすくする
utgwkk
1
130
go test -json そして testing.T.Attr / Kyoto.go #63
utgwkk
4
680
自動で //nolint を挿入する取り組み / Gopher's Gathering
utgwkk
1
1.4k
ゆるやかにgolangci-lintのルールを強くする / Kyoto.go #56
utgwkk
2
2.8k
君たちはどうコードをレビューする (される) か / 大吉祥寺.pm
utgwkk
21
16k
Dive into gomock / Go Conference 2024
utgwkk
14
8.1k
Goでリフレクションする、その前に / Kansai.go #1
utgwkk
4
3.6k
Go製Webアプリケーションのエラーとの向き合い方大全、あるいはやっぱりスタックトレース欲しいやん / Kyoto.go #50
utgwkk
7
4.2k
mockgenによるモック生成を高速化するツール bulkmockgenのご紹介 / Kyoto.go #43
utgwkk
2
2.5k
Other Decks in Programming
See All in Programming
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
manfredsteyer
PRO
0
180
ZOZOにおけるAI活用の現在 ~モバイルアプリ開発でのAI活用状況と事例~
zozotech
PRO
8
4.1k
AIコードレビューがチームの"文脈"を 読めるようになるまで
marutaku
0
310
【CA.ai #3】ワークフローから見直すAIエージェント — 必要な場面と“選ばない”判断
satoaoaka
0
210
AWS CDKの推しポイントN選
akihisaikeda
1
240
tsgolintはいかにしてtypescript-goの非公開APIを呼び出しているのか
syumai
5
1.1k
Reactive Thinking with Signals and the new Resource API
manfredsteyer
PRO
0
160
connect-python: convenient protobuf RPC for Python
anuraaga
0
350
Socio-Technical Evolution: Growing an Architecture and Its Organization for Fast Flow
cer
PRO
0
260
All(?) About Point Sets
hole
0
260
GeistFabrik and AI-augmented software development
adewale
PRO
0
250
Why Kotlin? 電子カルテを Kotlin で開発する理由 / Why Kotlin? at Henry
agatan
2
6.2k
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Agile that works and the tools we love
rasmusluckow
331
21k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.2k
The Cult of Friendly URLs
andyhume
79
6.7k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Designing for humans not robots
tammielis
254
26k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
Building an army of robots
kneath
306
46k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
For a Future-Friendly Web
brad_frost
180
10k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.3k
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 フロントエンドの世界に飛び込むきっかけを作ってくれてありがとう