·react-useeffect
</>

react-useeffect

React useEffect best practices from official docs. Use when writing/reviewing useEffect, useState for derived values, data fetching, or state synchronization. Teaches when NOT to use Effect and better alternatives.

11Installs·1Trend·@petekp

Installation

$npx skills add https://github.com/petekp/claude-code-setup --skill react-useeffect

How to Install react-useeffect

Quickly install react-useeffect AI skill to your development environment via command line

  1. Open Terminal: Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.)
  2. Run Installation Command: Copy and run this command: npx skills add https://github.com/petekp/claude-code-setup --skill react-useeffect
  3. Verify Installation: Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw

Source: petekp/claude-code-setup.

SKILL.md

View raw

Effects are an escape hatch from React. They let you synchronize with external systems. If there is no external system involved, you shouldn't need an Effect.

| Derived state from props/state | useState + useEffect | Calculate during render | | Expensive calculations | useEffect to cache | useMemo | | Reset state on prop change | useEffect with setState | key prop | | User event responses | useEffect watching state | Event handler directly |

| Notify parent of changes | useEffect calling onChange | Call in event handler | | Fetch data | useEffect without cleanup | useEffect with cleanup OR framework |

React useEffect best practices from official docs. Use when writing/reviewing useEffect, useState for derived values, data fetching, or state synchronization. Teaches when NOT to use Effect and better alternatives. Source: petekp/claude-code-setup.

Facts (cite-ready)

Stable fields and commands for AI/search citations.

Install command
npx skills add https://github.com/petekp/claude-code-setup --skill react-useeffect
Category
</>Dev Tools
Verified
First Seen
2026-02-22
Updated
2026-03-10

Browse more skills from petekp/claude-code-setup

Quick answers

What is react-useeffect?

React useEffect best practices from official docs. Use when writing/reviewing useEffect, useState for derived values, data fetching, or state synchronization. Teaches when NOT to use Effect and better alternatives. Source: petekp/claude-code-setup.

How do I install react-useeffect?

Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/petekp/claude-code-setup --skill react-useeffect Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw

Where is the source repository?

https://github.com/petekp/claude-code-setup