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
React.jsの キャッチアップは 「取捨選択」が9割
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
ミカイ
November 07, 2024
0
22
React.jsの キャッチアップは 「取捨選択」が9割
BEELT : BEENOS LT会 #8 フロントエンド開発
2024/06/07
https://beenos.connpass.com/event/320015/
ミカイ
November 07, 2024
Tweet
Share
More Decks by ミカイ
See All by ミカイ
今からフロントエンドを0から勉強するならSvelteもありかも
junmikai
0
82
tsoaはいいぞ!APIドキュメントを自動生成!
junmikai
0
46
生成AI活用はHOWが大事な理由
junmikai
0
170
2025年の抱負: フリーランスから 正社員に戻るので 組織に貢献します!
junmikai
0
100
Chakra UI v3にバージョンアップしてほぼ別物になった件
junmikai
0
1k
LTのテーマ決めは「多数派」を意識しよう ~ LT年40回登壇した件~
junmikai
0
34
成長するには「重要 VS 緊急」を意識しよう
junmikai
0
16
LTのテーマ決めは「多数派」を意識しよう ~ LT年40回登壇した件~
junmikai
0
39
目標は「めいそう」が大事。漢字はどう書く?
junmikai
2
56
Featured
See All Featured
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.4k
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
170
So, you think you're a good person
axbom
PRO
2
1.9k
Skip the Path - Find Your Career Trail
mkilby
0
60
Accessibility Awareness
sabderemane
0
57
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
920
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.1k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
68
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.1k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.4k
Transcript
React.jsの キャッチアップは 「取捨選択」が9割 三海 純(ミカイジュン)
ミカイ ジュン • フリーランスエンジニア • 趣味: もくもく会、ネット麻雀(雀魂)、ブルーアーカイブ
• 特技: 週6ぐらいは毎日5時起き ▪ 平日はゲーム2時間、業務外の勉強2時間 ▪ 休日はゲーム6時間、業務外の勉強4時間 • 好きな有名人 ◦ 後藤 ひとり、千早 愛音 ◦ 陸八魔アル、八木 唯 など
キャリア • 現在 : フリーランス(自社開発) ◦ Next.jsの新規開発 とバックエンドを担当
• 2022/03 - 2023/09: 正社員(自社開発) ◦ バックエンドはPython / Nest.js(Node.js) ◦ フロントエンドはReact.jsとNext.js • 2020/06 - 2022/02: 正社員(受託企業) ◦ Vue.js/Nuxt.jsをメイン
React.js(Next.js)の キャッチアップって 難しいですよね・・・
None
今ではNext.jsの 新規開発・設計・指導を担 当しています
React.jsを キャッチアップした時に - 必要だったもの ⭐ - 後で学べばいいもの 💦
があるので共有したいと思います
React.jsのキャッチアップのゴールは 実務で活躍できる知識を 最優先で身につけること これだけ
目標のために必要なことは・・・ React.jsとTypeScriptで TODOリストレベルを 作ってみる だけ
以上
実際に自分が勉強した内容で これは後で学んでも よかったなだったな〜 というものを4つ紹介
おことわり これから紹介する技術は大事なことです ただし、メンバークラスの エンジニアはすぐに使わなそう という意味で紹介します
後で学べばいいもの1 💦 Webの仕組み全般
HTTP、CORSといったWebの仕組み全般 これらは大事なことですが、 初めてReact.jsを実務で関わること になった時は画面実装が メインになるためこれらの
知識は使わないことが多い
後で学べばいいもの2 💦 パッケージマネージャーの キャッチアップ
npmやyarnといったもの。 新規開発でない場合はコマンド実行する だけのことが多い。 新規開発でもテンプレートが いっぱいあるのでそれを参考に
すれば良い
後で学べばいいもの3 💦 CSSの設計手法
BEM、OOCSS、SMACSS、FLOCSS といったCSSの書き方のこと。 現場から明確に「これ使います」 という案内があってから キャッチアップすればOK
後で学べばいいもの4 💦 JavaScriptやTypeScriptを 極めること
- JavaScriptの文法を分厚い本で学ぶ - TypeScriptの型パズル など React.jsに限った話ではないですが
使うかわからない技術は後回しでOK
「後で学べばいいもの」をあげた理由は 実務で活躍できる知識を 最優先身につけること
そのためには効率よく 学習することが大事です これってReact.jsだけの話では ないですよね〜
ご清聴ありがとうござ います!