How do I install the React You Might Not Need An Effect skill?

Run npx skillmds@latest add tomevault-io/react-you-might-not-need-an-effect in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is React You Might Not Need An Effect safe to use?

This skill has not completed SkillMD's automated safety review yet. Independent scanners report: SkillSpector: PASS, Skill Scanner: PASS. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with React You Might Not Need An Effect?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is React You Might Not Need An Effect free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published React You Might Not Need An Effect?

tomevault-io (@tomevault-io) published this skill. Their other Agent Skills are listed on their SkillMD profile.

React You Might Not Need An Effect by tomevault-io

Name: React You Might Not Need An Effect
Author: tomevault-io

React You Might Not Need An Effect

Guide for writing React code without unnecessary useEffect. Use when writing or editing React components. Avoid anti-patterns like derived state, chained state updates, and event handlers in effects. Use when this capability is needed.

tomevault-io Updated Sep 17, 2026

File contents

React: You Might Not Need an Effect

React公式ドキュメント「You Might Not Need an Effect」に基づき、不要なuseEffectを書かないようにする。

Instructions

Reactコンポーネントを書く・編集する際、useEffectを使う前に以下のパターンに該当しないか確認する。該当する場合はuseEffectを使わない代替案を採用する。

検出すべき12のアンチパターン

詳細は PATTERNS.md を参照。

React公式ドキュメントのパターン

パターン	問題	解決策
導出状態	propsやstateから計算可能な値をstateで管理	レンダリング時に計算
高コスト計算	useEffectでキャッシュ	useMemoを使用
propsでstate全体リセット	useEffectでリセット	keyを使用
props変更で一部state調整	useEffectで調整	レンダリング中に調整
イベントハンドラ処理	useEffectでAPIコール	イベントハンドラで直接処理
ロジック共有	useEffectで共通処理	関数を抽出して共有
状態の連鎖更新	useEffectのチェーン	イベントハンドラで一括更新

ESLintプラグイン追加パターン

パターン	問題	解決策
内部stateを親に渡す	useEffectでstateを親コールバックに渡す	stateを親にリフトアップ
外部データを親に渡す	useEffectでフェッチデータを親に渡す	親でデータ取得
refを親に渡す	useEffectでref.currentを親に渡す	forwardRefを使用
state初期化	useEffect内でリテラル値でstate設定	useStateの初期値で指定
空のuseEffect	中身が空のuseEffect	削除する

References

React公式: https://react.dev/learn/you-might-not-need-an-effect
ESLintプラグイン: https://github.com/NickvanDyke/eslint-plugin-react-you-might-not-need-an-effect

Converted and distributed by TomeVault — claim your Tome and manage your conversions.

---name: react-you-might-not-need-an-effectdescription: Guide for writing React code without unnecessary useEffect. Use when writing or editing React components. Avoid anti-patterns like derived state, chained state updates, and event handlers in effects. Use when this capability is needed.---# React: You Might Not Need an EffectReact公式ドキュメント「You Might Not Need an Effect」に基づき、不要なuseEffectを書かないようにする。## InstructionsReactコンポーネントを書く・編集する際、useEffectを使う前に以下のパターンに該当しないか確認する。該当する場合はuseEffectを使わない代替案を採用する。### 検出すべき12のアンチパターン詳細は [PATTERNS.md](PATTERNS.md) を参照。#### React公式ドキュメントのパターン| パターン | 問題 | 解決策 ||---------|------|--------|| 導出状態 | propsやstateから計算可能な値をstateで管理 | レンダリング時に計算 || 高コスト計算 | useEffectでキャッシュ | useMemoを使用 || propsでstate全体リセット | useEffectでリセット | keyを使用 || props変更で一部state調整 | useEffectで調整 | レンダリング中に調整 || イベントハンドラ処理 | useEffectでAPIコール | イベントハンドラで直接処理 || ロジック共有 | useEffectで共通処理 | 関数を抽出して共有 || 状態の連鎖更新 | useEffectのチェーン | イベントハンドラで一括更新 |#### ESLintプラグイン追加パターン| パターン | 問題 | 解決策 ||---------|------|--------|| 内部stateを親に渡す | useEffectでstateを親コールバックに渡す | stateを親にリフトアップ || 外部データを親に渡す | useEffectでフェッチデータを親に渡す | 親でデータ取得 || refを親に渡す | useEffectでref.currentを親に渡す | forwardRefを使用 || state初期化 | useEffect内でリテラル値でstate設定 | useStateの初期値で指定 || 空のuseEffect | 中身が空のuseEffect | 削除する |## References- React公式: https://react.dev/learn/you-might-not-need-an-effect- ESLintプラグイン: https://github.com/NickvanDyke/eslint-plugin-react-you-might-not-need-an-effect---> Converted and distributed by [TomeVault](https://tomevault.io/claim/azu) — claim your Tome and manage your conversions.

Frequently asked questions