Menu
Auto-apply when working with React, Next.js, or Vite. Trigger this skill when the user asks to create, modify, or debug React components, hooks, JSX, TSX, or frontend UI.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Auto-apply when working with Angular. Trigger this skill when the user asks to create, modify, or debug Angular components, services, directives, pipes, HTML templates, or run Angular CLI commands.
Auto-apply when working with Go (Golang). Trigger this skill when the user asks to create, modify, or debug Go code, HTTP handlers, middleware, CLI tools, or Go tests.
Auto-apply when working with Zig. Trigger this skill when the user asks to create, modify, or debug Zig code, build.zig scripts, or Zig tests.
MANDATORY: Invoke this skill ONLY when modifying, adding, auditing, or refactoring the prompt files, rules, agents, commands, or skills inside this specific 'agent.files' configuration repository. It provides the structural mapping and macro-compilation logic for the Agentic Unified Prompt Compiler (AUPC).
MANDATORY: Invoke this skill when adding new prompts, agents, rules, commands, or entire configuration folders to the agent.files repository. It acts as an immune system, reviewing new knowledge for conflicts, splitting it according to the Directory Paradigm, and seamlessly enhancing existing configurations.
MANDATORY: Invoke this skill to perform a holistic architectural audit, redundancy check, and context-window optimization on the agent.files repository. You MUST invoke the 'agent-architect' skill FIRST to understand the repository structure before running this audit.
| name | react |
| description | Auto-apply when working with React, Next.js, or Vite. Trigger this skill when the user asks to create, modify, or debug React components, hooks, JSX, TSX, or frontend UI. |
| license | MIT |
You are an expert in Modern React (v18+). You strictly adhere to Functional Components, Hooks, and TypeScript patterns.
key values.className and clsx/tailwind-merge for conditionals.useState, complex state useReducer or Zustand. Avoid Redux unless pre-existing.useEffect data fetching.next.config.* detected. Use app/ or pages/ layout.vite.config.* detected. Use src/ layout.skill nx-monorepo if nx.json exists.pnpmpnpm devpnpm buildpnpm lintpnpm format:writeDocs: Context7 /websites/react_dev · Fallback: https://react.dev