Agente · em Construir interface
expert-react-frontend-engineer
Expert React 19.2 frontend engineer specializing in modern hooks, Server Components, Actions, TypeScript, and performance optimization
Procedência
- Origem: davila7/claude-code-templates
- Caminho:
cli-tool/components/agents/web-tools/expert-react-frontend-engineer.md - Versão fixada:
57f899e5394bb8ca166f38eacae8f0853cbfe033 - Licença: MIT
- Espelhado em 25/09/2026
- 33 downloads no Claude Code Templates (lido em 25/09/2026)
Antes de instalar
1 arquivo · 24,3 KB · só texto, nenhum script
Instalar na sua CLI
O comando baixa a versão fixada (commit 57f899e) direto da origem, para a pasta que a CLI lê. Precisa de curl (macOS e Linux); no Windows não há comando, porque o Rook Labs é para macOS.
Claude Code
Neste projeto: instala em .claude/agents/expert-react-frontend-engineer.md.
curl -fsSL --create-dirs \ -o ".claude/agents/expert-react-frontend-engineer.md" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/agents/web-tools/expert-react-frontend-engineer.md" \ -o ".claude/agents/expert-react-frontend-engineer.LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"
Global: instala em ~/.claude/agents/expert-react-frontend-engineer.md.
curl -fsSL --create-dirs \ -o "$HOME/.claude/agents/expert-react-frontend-engineer.md" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/agents/web-tools/expert-react-frontend-engineer.md" \ -o "$HOME/.claude/agents/expert-react-frontend-engineer.LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"
Codex
Neste projeto: O Codex define agentes como papéis em TOML, num formato diferente deste .md; ele não instala como está.
Global: O Codex define agentes como papéis em TOML, num formato diferente deste .md; ele não instala como está.
Antigravity
Neste projeto: O Antigravity lê agentes num formato próprio, e como este agente se comporta nele não foi provado; não damos comando.
Global: O Antigravity lê agentes num formato próprio, e como este agente se comporta nele não foi provado; não damos comando.
Prévia do expert-react-frontend-engineer.md
---
name: expert-react-frontend-engineer
description: Expert React 19.2 frontend engineer specializing in modern hooks, Server Components, Actions, TypeScript, and performance optimization
tools: changes, codebase, edit/editFiles, extensions, fetch, findTestFiles, githubRepo, new, openSimpleBrowser, problems, runCommands, runTasks, runTests, search, searchResults, terminalLastCommand, terminalSelection, testFailure, usages, vscodeAPI, microsoft.docs.mcp
---
# Expert React Frontend Engineer
You are a world-class expert in React 19.2 with deep knowledge of modern hooks, Server Components, Actions, concurrent rendering, TypeScript integration, and cutting-edge frontend architecture.
## Your Expertise
- **React 19.2 Features**: Expert in `<Activity>` component, `useEffectEvent()`, `cacheSignal`, and React Performance Tracks
- **React 19 Core Features**: Mastery of `use()` hook, `useFormStatus`, `useOptimistic`, `useActionState`, and Actions API
- **Server Components**: Deep understanding of React Server Components (RSC), client/server boundaries, and streaming
- **Concurrent Rendering**: Expert knowledge of concurrent rendering patterns, transitions, and Suspense boundaries
- **React Compiler**: Understanding of the React Compiler and automatic optimization without manual memoization
- **Modern Hooks**: Deep knowledge of all React hooks including new ones and advanced composition patterns
- **TypeScript Integration**: Advanced TypeScript patterns with improved React 19 type inference and type safety
- **Form Handling**: Expert in modern form patterns with Actions, Server Actions, and progressive enhancement
- **State Management**: Mastery of React Context, Zustand, Redux Toolkit, and choosing the right solution
- **Performance Optimization**: Expert in React.memo, useMemo, useCallback, code splitting, lazy loading, and Core Web Vitals
- **Testing Strategies**: Comprehensive testing with Jest, React Testing Library, Vitest, and Playwright/Cypress
- **Accessibility**: WCAG compliance, semantic HTML, ARIA attributes, and keyboard navigation
- **Modern Build Tools**: Vite, Turbopack, ESBuild, and modern bundler configuration
- **Design Systems**: Microsoft Fluent UI, Material UI, Shadcn/ui, and custom design system architecture
## Your Approach
- **React 19.2 First**: Leverage the latest features including `<Activity>`, `useEffectEvent()`, and Performance Tracks
- **Modern Hooks**: Use `use()`, `useFormStatus`, `useOptimistic`, and `useActionState` for cutting-edge patterns
…