how-to-use-react masseater/typescript-template から作ったリポジトリ向けに、原典を読み替えてある。原典と食い違うときは、読み替えを採る。 - 状態は Effect Atom と TanStack Query に置き分ける - 非同期の瀑布を消す - React Compiler があるリポジトリでは 、 、 を書かない - 原典にある Next.js、SWR、Redux、 は採らない この skill が必要な理由と達成したい状態 この skill が必要な理由は、React が同じ画面を何通りにも書け、どの書き方でも初めは動くことにある。違いはデータが増え、通信が遅れ、操作が重なったときに出るので、書いた時点では悪い書き方を選んだことに気づけない。 この skill で達成したい状態は、画面がユーザーの操作を止めず、待たせず、どの状態もどこに置くか迷わないことである。 置き分け | やりたいこと | 使うもの | 使わないもの | | --- | --- | --- | | 画面の一時状態、フォームの値、ツリーをまたいで共有する値 | Effect Atom（ 、 、 ） | 、 、 、 （ が拒否する） | | サーバーデータ | TanStack Query（ は FSD の セグメント） | での取得、 と の組み合わせ、At…