React

A comprehensive reference guide for modern frontend development with React and Next.js. Covers component composition patterns, custom hooks, state management with Context/Reducer, performance optimization techniques (memoization, code splitting, virtualization), form handling, error boundaries, animations with Framer Motion, and accessibility patterns for keyboard navigation and focus management.

This skill provides comprehensive coding standards and best practices for TypeScript, JavaScript, React, and Node.js development. It covers principles like KISS, DRY, and YAGNI, along with practical guidance on variable naming, error handling, async patterns, React components, API design, and testing standards.

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

This skill helps developers modernize React applications by providing comprehensive guidance on upgrading from React 16 to 18, migrating class components to functional components with hooks, and adopting concurrent features like Suspense and Transitions. It includes code examples, codemod commands, and migration checklists.

A comprehensive accessibility compliance skill that provides WCAG 2.2 guidelines, ARIA patterns, keyboard navigation implementations, and screen reader optimization techniques. It includes ready-to-use code examples for accessible React components including buttons, dialogs, forms, and focus management utilities.

A comprehensive migration toolkit that helps upgrade legacy applications to modern frameworks. Covers AngularJS to Angular migration with hybrid mode support, React class-to-hooks conversion, database schema migrations across ORMs (Sequelize, TypeORM, Prisma), and major dependency version upgrades with compatibility analysis and rollback procedures.

A comprehensive frontend development skill that provides patterns and best practices for Next.js 14+ App Router, React Native with Expo, modern state management (Redux Toolkit, Zustand, Jotai), and Tailwind CSS design systems. Includes agent definitions for frontend and mobile development, plus component scaffolding templates.

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

This skill provides comprehensive design guidelines for creating distinctive, production-grade frontend interfaces. It covers typography choices, color themes, motion/animations, spatial composition, and background effects while explicitly avoiding generic 'AI slop' aesthetics like overused fonts and clichéd color schemes.

This skill provides comprehensive web UI design guidelines focusing on accessibility (WCAG 2.1 AA compliance), glassmorphism effects, dark mode support, and Tailwind CSS component patterns. It includes ready-to-use code snippets for buttons, cards, inputs, and layout systems with best practices for visual hierarchy, typography, and micro-interactions.

This skill provides comprehensive guidance for building Next.js applications with Supabase backend services and Drizzle ORM. It covers authentication patterns, server/client component separation, database queries, file storage, realtime subscriptions, and OAuth integration with clear code examples and project structure recommendations.

A comprehensive React web development skill that enforces test-first development (TDD) methodology. It provides patterns for functional components, custom hooks, state management with Zustand and React Query, routing with React Router, form handling with React Hook Form and Zod, and testing with React Testing Library and Playwright.

This skill provides comprehensive PostHog analytics integration patterns for web and backend applications. It covers installation for Next.js, React, Python, and Node.js, along with best practices for user identification, event tracking conventions, feature flags, A/B testing, and creating project-specific dashboards for SaaS, e-commerce, and content applications.