#intermediate
【解決】useEffectでasync/awaitを使う正しい方法と注意点
useEffectに直接asyncを付けてはいけない理由と、正しいasync/awaitの書き方を解説。内部関数として定義する方法・クリーンアップとの組み合わせ・競合状態（race condition）の防ぎ方まで実例付きで説明します。
2024-04-02
【解決】TypeScript × React でよくある型エラー集：原因と修正パターン
TypeScript + Reactでよく遭遇する型エラーを解説します。propsの型定義・イベントハンドラの型・useStateの型引数・children・非同期の型推論など実務頻出パターンをまとめました。
2024-03-05
【解決】useEffectの無限ループを止める：原因別5パターンの修正方法
useEffectが無限ループする原因を5パターンに分けて解説します。依存配列の誤り・オブジェクト参照・関数・setStateの連鎖など、よくあるパターンと具体的な修正コードを示します。
2024-03-04
useStateの完全ガイド：関数型更新・配列・オブジェクトの正しい扱い方
ReactのuseStateを完全解説します。型推論・関数型更新・オブジェクト・配列のイミュータブルな更新方法・複数stateの使い分けまで、実務で使えるパターンを実例付きで学べます。
2024-02-01
useEffectの基本：副作用とは何か・データフェッチの実装
ReactのuseEffectを基礎から解説します。副作用の概念・基本構文・マウント時にデータを取得する方法・非同期処理の書き方まで、実務で使えるパターンを実例付きで学べます。
2024-02-02
useEffectの依存配列：正しい指定方法とよくある落とし穴
useEffectの依存配列を徹底解説。空配列・値の指定・オブジェクトや関数を依存配列に含めたときの問題と解決策、exhaustive-depsルールの使い方を実例付きで説明します。
2024-02-03
useEffectのクリーンアップ：メモリリークを防ぐ正しい実装
useEffectのクリーンアップ関数を解説します。タイマー・イベントリスナー・非同期処理のキャンセルなど、アンマウント時に必要なクリーンアップの実装方法をメモリリーク防止の観点から学べます。
2024-02-04
useContextでグローバル状態管理：props drilling を解消する
ReactのuseContextを解説します。props drillingの問題・createContext・Provider・useContextで値を取得する方法、TypeScriptでの型安全な実装まで実例付きで学べます。
2024-02-05
useReducerでの状態管理：複雑なstateをスッキリ整理する
ReactのuseReducerを解説します。action・reducer・dispatchの概念、TypeScriptでの型安全な実装、useStateとの使い分け基準を、ToDoアプリを例に実践的に学べます。
2024-02-06
useRefの使い方：DOM参照・前回値の保持・レンダリングを起こさない値
ReactのuseRefを解説します。DOM要素への直接参照、前回値の保持、レンダリングをトリガーしない値の管理など、useRefの3つの主要ユースケースを実例付きで学べます。
2024-02-07
useMemoでパフォーマンス最適化：重い計算をメモ化する
ReactのuseMemoを解説します。メモ化の仕組み・高コスト計算の最適化・参照の安定化、そしてuseMemoを使うべき場面・使わなくてよい場面の判断基準を実例付きで学べます。
2024-02-08
useCallbackで関数をメモ化：React.memoと組み合わせた最適化
ReactのuseCallbackを解説します。関数のメモ化・React.memoとの組み合わせ・useEffectの依存配列での活用を実例で解説。useMemoとの違いと使い分けも明確にします。
2024-02-09
カスタムHookでロジックを再利用する：useFetch・useLocalStorage・useDebounce
Reactのカスタムフックの作り方を解説します。useFetch・useLocalStorage・useDebounceを実装例に、フックの抽出パターン・命名規則・テスト方法まで実践的に学べます。
2024-02-10
useTransitionでUI応答性を向上させる：React 18コンカレント機能
React 18のuseTransitionとuseDeferredValueを解説します。重い状態更新を「緊急でない」としてマークし、入力やクリックへの応答を維持しながら重い処理を裏で実行する仕組みを学べます。
2024-02-11
Hooksのルールとよくある間違い：シリーズ総まとめ
ReactのHooksが守るべきルールを解説します。条件分岐・ループ内での呼び出し禁止の理由、ESLint設定、無限ループや古い値参照などよくある間違いとその対処法をシリーズの集大成としてまとめます。
2024-02-12
<ViewTransition>でアニメーション遷移を実際に試す
Reactの実験的なViewTransitionコンポーネントを実際に試す。リストの並び替えや要素の出入りにアニメーションを付ける方法を、Vite環境で動かしながら解説する。
2026-06-27
最小Reactフレームワーク Waku をCloudflareで動かす
Jotai作者による最小Reactフレームワーク Waku を実際に試す。プロジェクト作成からServer Components、Cloudflareへのデプロイまでを手順を追って動かしながら解説する。
2026-06-27
React Bitsでアニメ付きUIを最短実装する
アニメ付きUIコンポーネント集 React Bits を実際に試す。jsrepoでの導入からBlurTextの設置までを、このサイトと同じVite+Tailwind環境で動かしながら解説する。
2026-06-27
ReactコンポーネントのProps型定義：基本から実践パターンまで
TypeScriptでReactのprops型を正しく定義する方法を解説。必須・省略可能・デフォルト値・children・ユニオン型・discriminated unionまで、実務で使うパターンを実例付きで網羅します。
2024-04-10
Reactイベントハンドラーの型定義：onClick・onChange・onSubmit
TypeScriptでReactのイベントハンドラーを正しく型定義する方法を解説。onClick・onChange・onSubmit・onKeyDown・フォーム要素ごとの型・カスタムイベントハンドラーのprops定義まで実例付きで説明します。
2024-04-11
useState・useRef・useReducerの型定義：TypeScriptで正しく型をつける
TypeScriptでReact HooksのuseState・useRef・useReducerに型をつける方法を解説。型推論が効くケース・明示が必要なケース・useRefのnull初期値問題・useReducerのaction型定義まで実例付きで説明します。
2024-04-12