2023年のフロントエンドと宣言的UI開発の歩き方
#フロントエンド
ジュニア向け
宣言的UIを開発するにあたって普遍的に役立つであろう情報をまとめたもの
なるべくライブラリやフレームワークに依存しない
気が向いたときに更新する予定koushisa.icon
Webフロントエンドのマインドマップ
考え方
Web開発に必要な情報、知識、学習リソースのほぼ全てはWEB上にある
Web Standards
学習リソースの中には1次情報もあれば、特定の文脈に沿って再整理された2次, 3次情報、時には誤情報もある
これらの情報の質と量のかけあわせによりアウトプットは左右される
WEB検索エンジンから必要な情報を取り出し、整理し、組み立てるスキルが肝要
Web検索エンジンへ渡すクエリ(またはプロンプト(AI))を最適化する
全体を俯瞰しつつ、各技術領域の関連性とその構成要素を知る
語彙と視点を増やすほど自分の目的に沿った回答を探しやすくなる
マインドマップやチートシート(CheatSheet)は、クエリを組み立てるための知識を得るのに有用
何を学ぶか迷子になったら参考にしたい
フロントエンドの知識地図
Frontend Developer Roadmap: What is Frontend Development?
React Developer Roadmap: Learn to become a React developer
"学び方"の参考
大人の学びのパターン・ランゲージ(略称まなパタ) | デジタル人材の育成 | IPA 独立行政法人 情報処理推進機構
体系的に学びたい人向け
0.ブラウザレンダリングの仕組み
1.Webフロントエンドのメンタルモデル再構築
2.なぜReactを使用するのか
3.なぜNext.jsを使用するのか
3.Reactの守破離
手を動かしながら学びたい人向け
Epic Web
Next.js Learn Course
Vercel Templates
他
研修
現代的システム開発概論
Webフロントエンドの開発効率を高く保つための考え方
ソフトウェア設計の原則を歴史から体系的に学ぶには
Webフロントエンドのパフォーマンス周り