中川 幸哉
有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ（代表 山田祥寛）に所属するテクニカルライター。新潟県上越市出身。会津大学コンピュータ理工学部卒業後、現在は新潟市に在住。ReactやAndroidを軸に、モバイルアプリ開発やWebサイト制作、Webメディア編集部の業務改善や、プログラミング技術記事の執筆等に携わっている。著書に「たった1日で基本が身に付く! Androidアプリ開発超入門」（技術評論社）、「基礎から学ぶ React Native入門」（翔泳社）他。
いまRemix v3を学ぶ意味。Reactとの使い分けから考える技術選定の基準
最終回となる今回は、まずフォーム送信の段階的強化とミドルウェア設計という2つの実践パターンを紹介します。これらは、第1回で描いた「薄いフレームワーク」の思想が、実際のアプリケーション開発でどのように機能するかを示す好例です。その上で、Remix v3がどのようなプロジェクトに適しているのか技術選定の視点から考察し、筆者なりの評価と今後の展望を述べます。
Remix v3をサンプルコードで体験する。React非依存で“明示的に”UI制御できるコア機能3つ
今回は、実際にコードを書きながらRemix v3の特徴を体験します。概念として理解することと、手を動かして体感することは異なります。本稿では、配布サンプルコードを用いて、手動リアクティビティ、型安全ルーティング、合成イベントシステムの3つの機能を実践的に学んでいきましょう。
React状態管理ライブラリの選択指針：「ローカル/グローバル/サーバー」における使い分けの基準
「このプロジェクトの状態管理、どうする？」Redux Toolkit？ Zustand？ Jotai？ 各ライブラリのドキュメントを読んでも、「結局どれを選べばいいのか」という判断基準が見えてこない。今回は、状態の種類に応じた実践的なライブラリ選択指針と、状態管理パターンの進化について解説します。
Remix v3とReactのトレードオフを徹底考察：AI時代に再評価される「Web標準」への回帰
Webアプリケーションの開発を続けていると、「いつの間にかフレームワークの学習ばかりしている」と感じたことはないでしょうか。この課題は、フレームワークが「厚く」なることで生まれます。多機能で便利な反面、学習コストが高く、Web標準から遠ざかった独自の概念が増えていく。その結果、バージョンアップのたびに学び直しを強いられることになります。AIツールが普及した現代では、この問題はより深刻です。
Reactコンポーネントの不要な再レンダリングを制御する。useMemo/useCallbackの使いどころとPropsの粒度管理
適切なPropsの扱い方は、コンポーネントの再レンダリングを制御し、ユーザーエクスペリエンスの向上に大きく貢献します。本記事では、メモ化フックやPropsの粒度管理による、Propsの最適化テクニックを紹介。パフォーマンスと保守性を損なう代表的なアンチパターンもまとめました。
Reactデザインパターン「Compound Components」実践ガイド。TypeScriptの型設計でPropsを意のままに操る
「このボタンコンポーネントにどこまでのPropsを持たせるべき？」判断に迷ったことはありませんか。Propsのバケツリレーを避け、TypeScriptによる型安全性とCompound Componentsによる構造の柔軟性を両立するUIコンポーネント設計を解説します。
App Router時代における「大規模React開発」のフォルダ設計術。Colocationによる関心の分離
Reactフォルダ設計における「機能別分類」。その理論を実際のプロジェクトでどう実装するか、具体的なアプローチを紹介。index.tsによる公開API設計、Next.js App Routerとの組み合わせ方から、FSDなど選択肢を広げるための知識まで、ポイントを解説します。
Reactフォルダ構造の最適解。コンポーネントの数に合わせて選ぶ基本方針
React公式にフォルダ構造の規定はないため、規模に応じた選択が重要だ。迷いが生じにくい「フラット構造」や、「技術別」「機能別」分類など、それぞれの特徴と導入時の注意点を解説。プロジェクトに最適な構造を見つけるためのヒントを紹介する。
- 1