React AI Agent Skills

// React + MobX .cursorrules

Autonomous agents are AI systems that can independently decompose goals, plan actions, execute tools, and self-correct without constant human guidance. The challenge isn't making them capable - it's making them reliable. Every extra decision multiplies failure probability. This skill covers agent loops (ReAct, Plan-Execute), goal decomposition, reflection patterns, and production reliability. Key insight: compounding error rates kill autonomous agents. A 95% success rate per step drops to 60% b

You are a React component architecture expert specializing in scaffolding production-ready, accessible, and performant components. Generate complete component implementations with TypeScript, tests, s

Opinionated frontend development standards for modern React + TypeScript applications. Covers Suspense-first data fetching, lazy loading, feature-based architecture, MUI v7 styling, TanStack Router, performance optimization, and strict TypeScript practices.

Expert guidance for integrating and building applications with shadcn/ui components, including component discovery, installation, customization, and best practices.

A powerful Microsoft SQL Server MCP (Model Context Protocol) server that enables Claude Desktop to interact with SQL Server databases through natural language queries. - 🤖 AI-Ready: Seamless integration with Claude Desktop and MCP protocol - 🔍 Smart Queries: Execute SQL queries in CSV or JSON format through natural language - 🔐 Secure Authentication: Support for SQL Server Auth, Windows Auth, a

Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.

Per-component i18n AI-powered translation. Visual Editor. Multilingual CMS. React + Vite • Most i18n libraries are either too complex, too rigid, or not built for modern frameworks. Intlayer is a modern i18n solution for web and mobile apps. It’s framework-agnostic, AI-powered, and includes a free CMS & visual editor. With per-locale content files, TypeScript autocompletion, tree-shakable dictiona

Deploy applications and websites to Vercel. Use this skill when the user requests deployment actions such as "Deploy my app", "Deploy this to production", "Create a preview deployment", "Deploy and give me the link", or "Push this live". No authentication required - returns preview URL and claimable deployment link.

Expert ReactFlow architect for building interactive graph applications with hierarchical node-edge systems, performance optimization, and auto-layout integration. Use when Claude needs to create or optimize ReactFlow applications for: (1) Interactive process graphs with expand/collapse navigation, (2) Hierarchical tree structures with drag & drop, (3) Performance-optimized large datasets with incremental rendering, (4) Auto-layout integration with Dagre, (5) Complex state management for nodes an

Comprehensive software architecture skill for designing scalable, maintainable systems using ReactJS, NextJS, NodeJS, Express, React Native, Swift, Kotlin, Flutter, Postgres, GraphQL, Go, Python. Includes architecture diagram generation, system design patterns, tech stack decision frameworks, and dependency analysis. Use when designing system architecture, making technical decisions, creating architecture diagrams, evaluating trade-offs, or defining integration patterns.

React best practices and patterns for modern web applications

Cursor Rules

// React + React Query .cursorrules

KoliBri stands for "component library for accessibility" and was released as open source by the Informationstechnikzentrum Bund (ITZBund) for reuse and continued development. Together we make HTML accessible using reusable web components to ensure usability and accessibility. The HTML web standard is itself very “openly” specified in order to be as long-lasting and robust as possible. It therefore

// TypeScript React .cursorrules

You are an expert in TypeScript, Nose-Js, Next.

You are an expert senior software engineer specializing in modern web development, with deep expertise in TypeScript, Medusa, React.

// React + GraphQL (Apollo Client) .cursorrules

Backend: Node.js with Express.js

Build production React Native apps with Expo, navigation, native modules, offline sync, and cross-platform patterns. Use when developing mobile apps, implementing native integrations, or architecting React Native projects.

Master modern React state management with Redux Toolkit, Zustand, Jotai, and React Query. Use when setting up global state, managing server state, or choosing between state management solutions.

You are an expert in TypeScript, Node.

Scaffolds a new WebMCP tool component using useMcpTool with Zod schema, handler, annotations, and wires it into the WebMCPProvider tree. Use when the user wants to expose functionality as an MCP tool, make something callable by AI, add a new tool, or create an AI-accessible action.