はじめに
「Reactに入門した人のための
もっとReactが楽しくなるステップアップコース（完全版）」を受講したため、
備忘録でまとめました。
CodeSandboxについて
ブラウザ上でコードを書いて、そのままReactを動かせるツールです。
良かったところ
環境構築がいらない（すぐ始められる）
書いたコードがすぐ画面に反映される
再レンダリングとは？
Reactでは、stateやpropsが変わると画面が、再描画される仕組みがあります。
例
const [count, setCount] = useState(0);
このcountが変わると、画面が更新される
気づき
親が更新されると子コンポーネントも更新される
意図しない再レンダリングが起きることもある
対策
React.memo
useMemo
useCallback
CSSのあてかた
Reactではスタイルの書き方がいくつかある
主な方法
普通のCSS
CSS Modules（クラス名がかぶらない）
styled-components（JSの中に書く）
Tailwind CSS（クラスを組み合わせる）
ルーティング（React Router）
ページを切り替える仕組み
できること
URLごとに画面を変える
リンクでページ遷移する
イメージ
/home → ホーム画面
/about → 詳細ページ
コンポーネント設計
画面を小さく分けて作る考え方
分け方：
Atoms（ボタンなど）
Molecules（入力フォームなど）
Organisms（まとまりのあるUI）
気づき
再利用しやすくなる
コードが整理される
グローバルstate管理
アプリが大きくなると、状態管理が大変になる
JISOUのメンバー募集中！
プログラミングコーチングJISOUでは、新たなメンバーを募集しています。日本一のアウトプットコミュニティでキャリアアップしませんか？
興味のある方は、ぜひホームページをのぞいてみてください！