React

こんにちは。プロダクトの規模が膨らみ、コンポーネントがカオスになり始めた頃に誰もが直面するのが、「Propsのバケツリレー地獄」と「どこに何を書いたか分からない巨大コンポーネント」ですよね。「親が持っている状態を、なぜか何階層も下の子に渡す...

こんにちは。君もそろそろ「単に画面を組み立てられる」だけのジュニアを卒業し、コンポーネント設計の美しさと現実のトレードオフに頭を悩ませる中級のフェーズに入った頃だな。今回は、React開発において避けて通れない、しかし雑に扱いがちな「Pro...

こんにちは。チームのコードレビューをしていて、未だに「あ、ここでそれやっちゃうんだ」と頭を抱えたくなる瞬間がある。それが今回取り上げる Propsのデフォルト値の扱い方 だ。Reactを触り始めて最初に覚えるのが `defaultProps...

やあ、お疲れ。最近、君の書いているコードをレビューしていて「お、いい感じにコンポーネントの抽象化ができるようになってきたな」って感心してたところだ。でもな、先日書いてくれた汎用的なリストコンポーネントのプルリクエスト、あれはちょっともったい...

こんにちは。チームのコードレビューをしていて、一番「あぁ、またか」とため息が出る瞬間ってどんな時ですか？私はね、PR（プルリクエスト）の差分を見たときに、あるコンポーネントのProps定義が `type` で書かれていたり、別のファイルでは...

お疲れ。今日は少し「タイムマシン」に乗ってもらうことになるかもしれない。今やフロントエンドの開発現場において、TypeScriptは「あって当たり前のインフラ」だ。`interface` や `type` でPropsをガチガチに固め、ID...

こんにちは。フロントエンドチームのシニアアーキテクトだ。今日は、君たちが日々の開発で頭を悩ませているかもしれない「React Server Components（RSC）とPropsの交差点」、特にRSCをProps（childrenやカス...

やあ、調子はどうだい？最近、現場でもすっかりお馴染みになってきたReact Server Components（RSC）だけど、コードレビューをしていて一番やりがちな「やらかしポイント」って知ってるかい？そう、「サーバーからクライアントへ、...

こんにちは。現場の最前線で毎日コードと向き合っていると、「動くには動くけれど、どうもパフォーマンスが怪しい」「親の再描画に引きずられて、子コンポーネントが無駄にレンダリングされている気がする」という壁にぶつかることがよくありますよね。中級か...

やあ、今日もコードと格闘ご苦労様。中級の壁を突破しようともがいている君なら、一度は「なぜこの子コンポーネントが無駄に再レンダリングされるんだ？」とReactのパフォーマンスチューニングの沼にハマったことがあるはずだ。「よし、`React.m...