596 Claude Code skills tagged React. Browse all topic-related skills in the open ClaudSkills registry — free to install, one-click via the desktop app.
Showing top 200 of 596 skills, ranked by quality score.
Internationalization (i18n) and localization (l10n) for web and mobile applications. Libraries next-intl, react-i18next, vue-i18n, formatjs, flutter_localizations, ARB. Trigger whe
content
Next.js development (App Router, Server Components, caching, streaming). Trigger when the user works with Next.js, modifies app/, pages/, next.config, or talks about RSC, Server Ac
engineering
React/Next.js performance optimization. Trigger when the user wants to optimize rendering, reduce re-renders, or improve Core Web Vitals.
engineering
Expert in internationalization (i18n) and localization (l10n) with i18next, react-intl, multi-language support, RTL layouts, locale-specific formatting, translation manag — from co
content
Expert in internationalization (i18n) and localization (l10n) with i18next, react-intl, multi-language support, RTL layouts, locale-specific formatting, translation manag — from co
content
Expert in internationalization (i18n) and localization (l10n) with i18next, react-intl, multi-language support, RTL layouts, locale-specific formatting, translation manag — from co
content
LangChain ReAct agent implementation with tool binding for reasoning and action loops
engineering
Use when React Hooks patterns including useState, useEffect, useContext, useMemo, useCallback, and custom hooks. Use for modern React development.
engineering
Use when handling platform-specific code in React Native for iOS and Android. Covers Platform API, platform-specific components, native modules, and cross-platform best practices.
engineering
Generates PDF documents using the React-PDF library (@react-pdf/renderer) with TypeScript and JSX.
engineering
Build a capability end-to-end — backend vertical slice (Contracts→handler→validator→endpoint) AND the React page wired to it. Use when delivering a user-facing feature across API +
engineering
Scaffold a test for a react-native-css feature following the project's testing conventions.
engineering
This skill should be used when the user asks to "create a ReAct agent", "build an agent with tools", "implement tool-calling agent", "use dspy.ReAct", mentions "agent with tools",
engineering
Implement or refactor Next.js frontend features with Tailwind and Skeleton UI. Covers App Router, Server Components, Server Actions, Skeleton themes and components, layout patterns
engineering
Audit/fix Next.js i18n SEO — crawlability, 307 redirects, locale URLs, sitemap, hreflang.
engineering
Next.js SEO optimization guide. Use when building Next.js apps, optimizing for search engines, fixing Google indexing issues, implementing metadata, sitemaps, robots.txt, JSON-LD,
engineering
Creates Next.js frontends with shadcn/ui. Use when building React UIs, components, pages, or applications with shadcn, Tailwind, or modern frontend patterns. Also use when the user
engineering
Audit React components for unnecessary useEffect patterns. Detects 9 anti-patterns from "You Might Not Need an Effect" and proposes fixes with severity levels.
engineering
Generate complete Next.js App Router route segments with all conventions
tools
Decision-support dossier for picking a JS/TS animation or rendering library. Use this skill whenever the user is choosing, comparing, evaluating, or scaffolding a motion / animatio
content
React Native and Expo best practices for Wythm mobile-app.
engineering
Ad-hoc development workflow for implementing features, fixing bugs, and making code changes outside a formal plan. Use when asked to implement, add, fix, build, or create — from to
engineering
Patches native modules (expo-image, react-native, etc.) to fix native crashes or bugs.
engineering
Automatically validate React/Next.js components meet WCAG 2.1 AA standards. Use when creating components, forms, buttons, modals, navigation, or any interactive UI elements.
product
Remix. Notion's warm neutral document surface + Duolingo's saturated greens, rounded corners, and tactile feedback. For learning platforms, courses, and education tools that want t
engineering
Scaffold a new agent platform page with the project's standard layout, RTL Arabic, react-query data fetch, skeleton, and sidebar entry. Use when the user asks to "add a page", "cre
engineering
Fügt einen neuen Sidebar-Tab mit React-View hinzu. Erstellt View-Komponente in src/views/, TabRouter-Eintrag und Sidebar-Button. Backend-Commands werden über /add-tauri-command hin
engineering
Adição de Tailwind CSS v4 e shadcn/ui em projetos Vite + React + TypeScript. Use após a skill init-vite-react-ts para configurar alias @, plugin do Tailwind no Vite, inicialização
tools
Next.js App Router conventions — Server Components by default, leaf-node 'use client' boundaries, server-side data fetching with cache control, Server Actions for mutations, file-s
engineering
KAF Motors ilan giriş/düzenleme sihirbazı işleri — çok adımlı form (react-hook-form + zod), Tiptap zengin metin, react-dropzone resim yükleme ve interaktif ekspertiz SVG bileşenler
engineering
Advanced color science and dynamic palette generation from 20 production repos. LCH/OKLAB perceptual math, dark-mode pair algorithms, contrast enforcement, gamut mapping, CSS color
engineering
Production-grade motion engineering from 20 repos. Spring physics, custom easing curves, GPU compositing rules, scroll-driven animations, micro-interactions, Lottie integration, re
growth
Complete methodology for building production-grade React applications with architecture decisions, component design, state management, performance optimization, testing, and deploy
engineering
Expert Next.js developer mastering Next.js 14+ with App Router and full-stack features. Specializes in server components, server actions, performance optimization, and production d
engineering
Expert React specialist mastering React 18+ with modern patterns and ecosystem. Specializes in performance optimization, advanced hooks, server components, and production-ready arc
engineering
Agent skill for spec-mobile-react-native - invoke with $agent-spec-mobile-react-native
engineering
Build agentic LLM-driven robotic manipulation pipelines using the ALRM framework pattern: a ReAct-style reasoning loop with dual execution modes (Code-as-Policy for direct code gen
engineering
Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices. — from engineering/frontend
engineering
Modern React UI patterns for loading states, error handling, and data fetching. Use when building UI components, handling async data, or managing UI states. — from engineering/fron
engineering
Comprehensive software architecture skill for designing scalable, maintainable systems using ReactJS, NextJS, NodeJS, Express, React Native, Swift, Kotlin, Flutter, Postg — from en
engineering
프로젝트 도메인 API 내재화 — 특정 라이브러리/프레임워크의 공식 문서 + 예제를 수집하여 프로젝트 내 .claude/references/에 저장하고 CLAUDE.md에 Knowledge Authority로 등록합니다. "API 학습", "api learn", "문서 내재화", "레퍼런스 수집", "라이브러리 학습",
engineering
App Store and Google Play submission automator with Fastlane, screenshot automation, metadata management, and TestFlight/internal testing. Activate on: app store submission, Fastla
engineering
Guide for bootstrapping AppForms in a C#/TypeScript project with Astrolabe.Schemas code generation, @react-typed-forms/schemas for rendering, and the visual form editor.
content
React custom hook design. Use when writing, reviewing, or refactoring use* functions or components with non-trivial state/effect logic.
engineering
Authentication patterns for Next.js applications using NextAuth.js (Auth.js) v5. Covers OAuth providers, credentials auth, middleware protection, session management, and role-based
engineering
Best practices for animations in React that stay buttery-smooth (60fps, no jank) — because motion and performance have to coexist: a beautiful animation that stutters is worse than
engineering
Build a throwaway single-file tool for a specific use case — runs on file://, persists to localStorage, no build step. Stack scales from static HTML to React-via-CDN based on inter
engineering
Integrate React+Vite web apps with bodhi-js-sdk for local LLM integration. Use when user asks to: "integrate bodhi", "add bodhi sdk", "connect to bodhi", "setup bodhi provider", "b
tools
Bootstrap a fresh or existing repo with nyann. TRIGGER when the user says "set up this project", "initialize git workflow", "bootstrap this repo", "scaffold this project", "ngyamm
product
Builds production data grids that stay fast and accessible at 10k–1M+ rows — decide server-side vs client-side sort/filter/paginate by the dataset-fits-in-memory test (client only
engineering
Use assistant-ui to build production React chat interfaces with reusable threads, runtimes, message components, and model/provider adapters.
engineering
Scaffolds production-grade React/Next.js components with proper props typing, server vs client component boundaries, and composition; used when building or restructuring UI compone
engineering
Build Next.js 16 applications with correct patterns and distinctive design. Use when creating pages, layouts, dynamic routes, upgrading from Next.js 15, or implementing proxy.ts. C
engineering
Use when building web UIs with Next.js 15+ and React 19 - covers Server Components, App Router, testing with Vitest and Playwright, and accessibility standards
engineering
Use when building server-rendered React with Bun, including streaming SSR, hydration, renderToString, or custom SSR without a framework.
engineering
Import directly from source files instead of barrel files. Apply when using libraries like lucide-react, @mui/material, or @radix-ui/react-* to reduce bundle size and improve dev b
tools
Create interactive learning games for business English practice. Supports multiple game types (quiz, simulation, drag-drop) across various business scenarios (emails, meetings, pre
engineering
Guides the agent through Capacitor app development with React — project structure, hooks for native features, state management patterns, using Capacitor plugins in React components
engineering
Architecture patterns from the Claude Code CLI for building AI-powered developer tools. Covers tool registry systems, permission models, agent orchestration (sub-agents, swarms, te
tools
Enforces project client component conventions for interactive React components with hooks, event handlers, Radix UI integration, and server action consumption. Extends react-coding
engineering
Deploy Next.js to Cloudflare Workers via OpenNext adapter. Use for SSR, ISR, App/Pages Router, or encountering worker size limits, runtime compatibility, connection scoping errors.
engineering
Next.js + React 코드 작성 시 시니어 기준 컨벤션 적용 및 레벨 진단. "코드 리뷰해줘", "이 패턴 맞아?", "더 좋은 방법", "시니어 패턴으로", "nextjs 컨벤션", "이 코드 수준이 어때?", "주니어 패턴", "미들 수준" 등이 언급될 때 반드시 사용. 코드 작성 시에는 시니어 기준 패턴을 기
engineering
Framework-specific patterns for integrating CometChat React UI Kit v6 into Next.js projects (App Router and Pages Router). Covers SSR prevention, provider setup, route placement, A
engineering
Framework-specific patterns for integrating CometChat React UI Kit v6 into React projects (Vite or CRA). Covers provider setup, routing, layout integration, env vars, and — from en
engineering
Framework-specific patterns for integrating CometChat React UI Kit v6 into React Router projects (v6 library mode and v7 framework mode). Covers SSR prevention, routing p — from en
engineering
Initialise un projet Next.js moderne (TypeScript, config stricte, outillage production). Utiliser pour demarrer un nouveau front Next.js.
tools
The shipped `remix/ui/<component>` headless library — Accordion, Anchor (positioning), Breadcrumbs, Button, Combobox, Glyph (icons), Listbox, Menu (dropdown / context), Popover (wi
engineering
Guidance for writing `@kubb/react-fabric` components and generators (React-based and function-based).
tools
Dieser Skill wird aktiviert, wenn der Benutzer den "visualizer", "react app", "demo", "clinical visualization", "token reduction visualisieren", "pipeline ergebnisse anzeigen", "co
engineering
Controllers in Remix v3 — the `.tsx` files under `app/controllers/` that handle requests. Covers the `Controller<typeof routes.X, AppContext>` shape, action handler signatures (`{
engineering
Cookies in Remix v3 via `remix/cookie` — the low-level building block sessions, auth, and CSRF build on. `createCookie(name, options)` for signed cookies (HMAC `secrets` array, rot
engineering
Genera el código completo de archivos React para corregir errores de ejecución (como propiedades indefinidas), respondiendo siempre en español y sin proporcionar ejemplos parciales
engineering
Создание View-компонента — презентационного React-компонента, отвечающего только за отображение UI. Используй когда нужен изолированный переиспользуемый компонент без бизнес-логики
engineering
Use when building Next.js 14+ applications with App Router, server components, or server actions. Invoke to configure route handlers, implement middleware, set up API rou — from an
engineering
Use when building React 18+ applications in .jsx or .tsx files, Next.js App Router projects, or create-react-app setups. Creates components, implements custom hooks, debu — from an
engineering
Builds, optimizes, and debugs cross-platform mobile applications with React Native and Expo. Implements navigation hierarchies (tabs, stacks, drawers), configures native — from ank
engineering
Architect bespoke React renderers for non-DOM environments using the `react-reconciler` package.
engineering
Automatic graph layout using dagre with React Flow (@xyflow/react). Use when implementing auto-layout, hierarchical layouts, tree structures, or arranging nodes programmatically. T
engineering
Create Next.js data table pages with SSR initial load, SWR caching, and server-response-based UI updates. Use when asked to create a new data table page, entity management page, CR
engineering
Debug React Native issues systematically. Use when encountering native module errors like "Native module cannot be null", Metro bundler issues including port conflicts and cache co
engineering
Use PROACTIVELY when debugging React Native apps. Reads console logs and executes JavaScript in running apps via Metro bundler. Invoke for: app crashes, state inspection, API debug
engineering
Tiefenanalyse eines Problems gemäß der OBERSTEN DIREKTIVE. Verfolgt den vollständigen Datenfluss React-View→tauri-api.ts→invoke→commands/→ps.rs und identifiziert die Wurzelursache.
engineering
Use when user requests deep analysis, thorough thinking, or detailed breakdown of a problem. Triggered by phrases like: 帮我深入思考, 请仔细分析, 帮我详细拆解, 请梳理一下思路, 仔细考虑, 深入理解, 详细分析, or similar
engineering
Create React frontends for Algorand dApps with wallet integration. Use when creating React frontends that interact with smart contracts, setting up wallet connections (Pera, Defly,
engineering
React + Tailwind + CSS-variable conventions for app/ — variant props, shared icons, tokens, demos, a11y. Use when implementing or reviewing generated UI with Tailwind and design to
engineering
Create professional, attractive, and visually striking user interfaces in Next.js. Use when building beautiful websites, landing pages, dashboards, or any UI that needs t — from en
engineering
Create professional, attractive, and visually striking user interfaces in Next.js. Use when building beautiful websites, landing pages, dashboards, or any UI that needs t — from en
engineering
Développement d'applications Next.js avec App Router, Server Components, SSR, ISR, API routes et middleware. Se déclenche avec "Next.js", "NextJS", "App Router", "Server — from eng
engineering
Crée des composants React/Vue/Angular/Svelte optimisés et réutilisables. Se déclenche avec "composant React", "component", "Vue component", "Angular component", "Svelte" — from eng
engineering
Guide de développement React Native avec Expo et navigation. Se déclenche avec "React Native", "Expo", "RN", "react-navigation", "native modules", "bridge", "mobile JavaS — from en
engineering
Type-safe API client generator from OpenAPI schemas with full ecosystem support. TRIGGER WHEN: - Setting up API client with OpenAPI schema (@devup-api/fetch) - Making typed API req
tools
Build Solana wallet-connected apps with Phantom Connect SDKs and DFlow trading. Use when user asks to connect a Phantom wallet, integrate Phantom in React, React Native, or vanilla
security
Dioxus is a fullstack app framework for Rust that enables building cross-platform applications for web, desktop, and mobile from a single codebase. With 24k+ GitHub stars and an ac
engineering
Look up CE.SDK Next.js reference docs, guides, and configuration pages.
engineering
Deep integration with Docusaurus for documentation site development. Configure projects, manage sidebars, versioning, i18n, develop plugins, and optimize builds for React-based doc
engineering
Docusaurus is an open-source static site generator built with React, developed and maintained by Meta. It enables teams to build, deploy, and maintain documentation websites, blogs
engineering
Expert guide for building Emacs UIs with vui.el (React-like declarative components). Use when implementing vui-defcomponent, vui-mount, vui-use-async, or any vui primitive (vui-tex
tools
When the user wants to create or optimize an email sequence, drip campaign, automated email flow, or lifecycle email program. Also use when the user mentions "email seque — from ma
tools
Use compile-time validated environment variables with t3-oss/env-nextjs. Ensures type-safe access to environment variables with automatic validation at build time. Use when accessi
engineering
Aplica um estilo visual específico a uma label de nome em um componente React/TypeScript, utilizando fonte arredondada (ex: Poppins), cor laranja (#e26512), contorno preto via text
engineering
Shared reference for the Expo cluster: EAS (Build/Submit/Update/Hosting), app config + config plugins, the Expo Go vs dev-client vs prebuild/CNG spectrum, SDK version policy, and E
engineering
Expo React Native JavaScript best practices for clean code, functional components, performance optimization, and Expo Router navigation.
engineering
Install and wire @tanstack/react-query in Expo/React Native apps (providers, query client, fetch patterns, and screen usage). Use when adding React Query to a project or extending
engineering
Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling — from engineering/frontend
engineering
Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling — from tools/tools-misc
tools
Expo managed workflow expert for EAS Build, Submit, Update, config plugins, and custom dev clients. Activate on: Expo project, EAS Build, EAS Update, config plugin, expo-dev-client
engineering
Faust.js by WP Engine is a JavaScript framework and WordPress plugin that streamlines building headless WordPress sites with Next.js. It handles data fetching via WPGraphQL, authen
engineering
Use when translating Code Complete's Java/C++ examples into 2026 React/TypeScript Before-After pairs, or when mapping FE checklist items to specific ESLint / typescript-eslint / re
content
Expert guidance for integrating FeatBit React Native SDK in mobile React Native and Expo applications. Use when user asks about "React Native SDK", "React Native feature flags", "F
engineering
Storing uploaded and generated files in Remix v3 via `remix/file-storage` — a key/value interface (`set`, `get`, `remove`, `has`) over three backends: `createFsFileStorage` (filesy
engineering
Complete guide for implementing file uploads in IntelliFill with React-dropzone frontend, Multer backend, file validation, Bull queue processing, and security best practices
security
Next.js 14+ App Router integration with Firebase including server/client SDK separation and data fetching patterns. PROACTIVELY activate for: (1) setting up dual SDK architecture f
engineering
Flutter state management expert with BLoC/Cubit, Riverpod, Provider, and Navigation 2.0 (GoRouter). Activate on: Flutter state management, BLoC pattern, Cubit, Riverpod, Provider,
engineering
Next.js 16 with React Server Components and Tailwind 4. Server-first by default, streaming with Suspense, server actions over API routes, app router conventions, async page params,
engineering
Rules-of-Hooks discipline for React. Hooks must be called unconditionally at the top of a component or another hook - never inside an if/else, loop, ternary, short-circuit (&& / ||
engineering
Build accessible, user-friendly forms with validation. Covers react-hook-form, Zod schemas, error handling UX, multi-step forms, input patterns, and form accessibility. Use for reg
product
To manage form state, validation, and submission efficiently without causing excessive re-renders, unlike controlled components. Use when: Complex forms with many fields; Forms req
engineering
End-to-end form handling with react-hook-form, Zod schemas, validation patterns, error messaging, field arrays, and multi-step wizards. Use for complex forms, validation architectu
engineering
i18n cho React apps — react-intl, FormatJS. Dùng khi implement đa ngôn ngữ, format số/ngày/tiền tệ chuẩn theo locale.
engineering
Forms knowledge base - react-hook-form, Zod validation, Server Actions, file upload, multi-step forms. Use when building forms, implementing validation, handling file uploads, or c
engineering
Generate React components that render FOSMVVM ViewModels. Scaffolds ViewModelView pattern with hooks, loading states, and TypeScript types.
tools
Senior Front-End Developer expertise in ReactJS, NextJS, JavaScript, TypeScript, HTML, CSS, and modern UI/UX frameworks
engineering
React, components, state management, and modern frontend concepts. Activated when Claude works with .jsx/.tsx files or React-related code. Most vibecoded apps use React.
engineering
Use when working with Next.js App Router tasks - creating pages in /app/, setting up dynamic routes ([id]/page.tsx), implementing nested layouts/templates (layout.tsx), optimizing
engineering
Frontend UI-specific patterns. For generic patterns, see: typescript, react-19, nextjs-15, tailwind-4. Trigger: When working inside src/react-app.
engineering
FastAPI + Reactのフルスタック開発を、設計→API→バックエンド→ドキュメント→フロント→画面仕様書→E2Eテストの順でオーケストレーションするスキル。 各フェーズの実装品質は python-impl / react-impl / openapi-docs / rest-api-test / screen-spec-reverse / play
tools
Next.js App Router アプリケーションに Google Cloud Trace (Telemetry API 直接送信 OTLP) と Cloud Logging 構造化ロギングを実装するスキル。instrumentation.ts フック、ADC を使ったトークン自動更新エクスポーター、startSpan + context.with()
engineering
Review React/TypeScript code for bugs, security vulnerabilities, performance issues, accessibility gaps, and CLAUDE.md workflow compliance. Enforces TypeScript strict mode, GPU-acc
engineering
Complete design system reference for React applications. Covers colors, typography, spacing, component patterns, glassmorphism effects, GPU-accelerated animations, and WCAG AA acce
product
Guide feature development for React applications with architecture focus. Covers Zustand/Redux patterns, IndexedDB usage, component systems, lazy loading strategies, and seamless i
product
Professional UI/UX design expertise for React applications. Covers design thinking, user psychology (Hick's/Fitts's/Jakob's Law), visual hierarchy, interaction patterns, accessibil
product
Automate filling job applications on Greenhouse.io and similar React-based ATS platforms via browser automation. Covers React input handling, reCAPTCHA detection, resume upload lim
engineering
Find Next.js-specific security issues across App Router, Pages Router, and Server Actions. Covers the middleware-bypass class, NEXT_PUBLIC environment leakage, RSC over-fetch, CSP
security
HeadstartWP is 10up's open-source framework for building headless WordPress sites with Next.js. It combines a WordPress plugin, JavaScript packages, and documented patterns for rou
engineering
Hunt Next.js specific vulnerabilities — Server Actions arbitrary function execution, Middleware auth bypass via static asset paths, ISR cache poisoning, Image Optimization SSRF (/_
engineering
Internationalization and localization patterns for multi-language applications. Use when implementing translation systems, locale-specific formatting, RTL layouts, or man — from Da
content
Internationalization and localization implementation. Use when implementing multi-language support, translation systems, locale-specific formatting, or RTL layouts. Keywords: i18n,
content
Framework-specific i18n implementation: i18next + react-i18next (React/Next.js), next-intl (Next.js App Router), Django's i18n (gettext/makemessages), Rails I18n (YAML-based), Loca
engineering
Internationalization and localization for the boilerplate monorepo. Covers backend (i18next), frontend (next-intl), and mobile (react-i18next) with shared types.
tools
Usa esta skill cuando implementes internacionalización en un proyecto Next.js App Router: next-intl, useTranslations, getTranslations, ICU MessageFormat, useFormatter, detección de
engineering
Usa esta skill cuando implementes internacionalización en un proyecto Vite SPA con React: react-i18next + i18next, ICU MessageFormat, pluralización, formateo de fechas/números/mone
engineering
Implement internationalization (i18n) in Ballee using react-i18next with Trans component and useTranslation hook; use when adding user-facing text, translating components, implemen
content
Visual design and aesthetic direction for frontend interfaces. Use when building web pages, landing pages, dashboards, or applications where visual identity matters. For React patt
engineering
React architecture patterns, TypeScript, Next.js, hooks, and testing. Use when working with React component structure, state management, Next.js routing, Vitest, React Te — from il
engineering
Develops Inertia.js v3 React client-side applications. Activates when creating React pages, forms, or navigation; using <Link>, <Form>, useForm, useHttp, setLayoutProps, or router;
engineering
Use when building terminal UIs with Ink component patterns for React-based CLI applications.
engineering
Explain in plain English what a nyann profile enables — stack, branching, hooks, extras, conventions, documentation. TRIGGER when the user says "what does the nextjs-prototype prof
product
Add Transloadit Smart CDN URL signing to a Next.js App Router project (server-side signing route + optional client demo page).
engineering
Add Uppy Dashboard + Transloadit uploads to a Next.js (App Router) app, with server-side signature generation and optional /s3/store export.
engineering
Amplitude integration for React applications using TanStack Router with code-based routing
engineering
Guides the agent through Ionic Framework development with React — project structure, React-specific Ionic components, IonReactRouter and navigation patterns, Ionic lifecycle hooks
engineering
Comprehensive React component testing with Jest and React Testing Library covering configuration, mocking strategies, async testing patterns, hooks testing, and integration testing
engineering
Jetpack Compose navigation expert with type-safe routes, Hilt DI, and MVVM/MVI architecture. Activate on: Jetpack Compose navigation, Compose type-safe routes, Hilt dependency inje
engineering
Toss Design System (TDS) React Native component library built on top of React Native/Expo. Use with jikime-mobile-react-native for complete mobile development patterns.
engineering
KeystoneJS is a powerful open-source headless CMS for Node.js that auto-generates a GraphQL API and React-based Admin UI from your schema definition. Built by Thinkmill, it support
engineering
Latest React features from React 19 and React Compiler (past 1.5 years - mid 2024 to 2026) — from majiayu000/claude-skill-registry
engineering
Complete mastery of essential modern web development libraries and dependencies. Cover Next.js, React, TypeScript, Tailwind CSS, Firebase, Zustand, redux-toolkit, react-hook-form,
product
Lighthouse optimization workflow for Next.js using next/image, next/font, script strategy tuning, client bundle reduction, and server/component boundary discipline.
engineering
Lighthouse workflow for React + Vite apps with focus on route-level lazy loading, dynamic imports, bundle reduction, hydration cost control, and stable UX semantics.
engineering
Build and review production-grade web and mobile frontends using LiveKit with Next.js. Covers real-time video/audio/data communication, WebRTC connections, track management, and be
engineering
Internationalization and localization patterns for multi-language applications. Use when implementing translation systems, locale-specific formatting (dates, numbers, cur — from co
content
Reference-only: MapLibre GL JS is installed via npm as maplibre-gl v5 and react-map-gl v8. Additional GIS libs: pmtiles, osmtogeojson, swr, @turf/turf. NOT a callable tool.
engineering
Build and embed a React widget into a Jekyll blog post as a self-contained HTML file
content
MediaPipe Vision WASMをNext.js/Webプロジェクトに導入する環境構築ガイド。@mediapipe/tasks-vision インストール、WASMファイル配置、webpack設定、Turbopack対応。mediapipe wasm setup nextjs webpack environment vision
tools
Reference card for every middleware shipped by Remix v3 — `logger`, `compression`, `staticFiles`, `formData`, `methodOverride`, `session`, `csrf`, `cop`, `cors`, `asyncContext`, `a
engineering
Migrate a React-only component to the shared core/React/Vue architecture
engineering
Switch this repository from one nyann profile to another. TRIGGER ON: 'switch profile', 'migrate profile', 'change this repo profile', 'switch from X to Y', 'change profile to', 'm
engineering
React/Next.js component design patterns, state management strategies, and project structure reference for frontend development. Agent-extending skill that amplifies expert-frontend
engineering
Mobile push notification expert for FCM, APNs, deep linking, rich notifications, and notification channels. Activate on: push notifications, FCM setup, APNs configuration, notifica
engineering
React Native patterns for cross-platform mobile apps. Use when building iOS/Android apps with React Native, Expo, navigation, device APIs, push notifications, or mobile-specific UI
engineering
Conventions for an Expo SDK 54+ React Native app targeting iOS + Android. Use when .claude/HARNESS.toml selects mobile/react-native-expo, or when building cross-platform RN UI with
engineering
Build clean, modern React components that apply common best practices and avoid common pitfalls like unnecessary state management or useEffect usage
engineering
Monitoring and observability for Next.js — Sentry error tracking, structured logging with Pino, OpenTelemetry tracing, health checks, uptime monitoring, alerting. Use when adding e
engineering
Use when integrating MonoCloud authentication into a Next.js application — installing or configuring `@monocloud/auth-nextjs`, wiring `authMiddleware()` in `proxy.ts`/`middleware.t
engineering
Ad-hoc development workflow for implementing features, fixing bugs, and making code changes outside a formal plan. Use when asked to implement, add, fix, build, or create — from to
engineering
Use when building cross-platform mobile applications with React Native or Expo. Invoke for navigation patterns, platform-specific code, native modules, FlatList optimization.
engineering
Scaffolding für ein neues Feature in der Tauri v2 App. Erstellt Rust-Command in commands/, typisierte API-Funktion in tauri-api.ts und React-View in src/views/. Nutze diesen Skill
product
Next.js specific patterns including App Router, React Server Components, Server Actions, streaming, caching, and Vercel deployment.
engineering
Use when working with Next.js 15 features, App Router, Server Components, Server Actions, or data fetching patterns. Ensures correct usage of Server vs Client Components and modern
engineering
Expert Next.js 16 with Turbopack, App Router, Cache Components, proxy.ts, React 19. Use when building Next.js apps, routing, caching, server components, or migrating from v15.
engineering
Comprehensive Next.js v16 development with Cache Components, feature-based architecture, and best practices. Use for ANY Next.js 16 task to know - (1) Project structure with featur
engineering
Creates a Next.js App Router API route (route.ts) with GET, POST, PUT, PATCH, or DELETE. Use when the user asks to add an API endpoint, create a REST route, build backend handler,
engineering
Deep expertise in Next.js App Router patterns including route groups, parallel routes, intercepting routes, layouts, and loading states.
engineering
Audit mechanical Next.js App Router CRUD scaffolds for correctness, security, UX, and maintainability.
tools
Expert in Next.js 14/15 App Router architecture, React Server Components (RSC), Server Actions, and modern full-stack React development. Specializes in routing patterns, data fetch
engineering
Special file conventions in Next.js 14+ App Router for pages, layouts, and API routes. PROACTIVELY activate for: (1) creating pages and layouts, (2) implementing loading and error
engineering
Next.js App RouterでのServer Components / Server Actions / Route Handlers等の使い分けガイド。「Server ComponentとClient Componentの違い」「Server Actionsの使い方」「revalidatePath/revalidateTagの違 — from ma
engineering
Next.js App RouterでのServer Components / Server Actions / Route Handlers等の使い分けガイド。「Server ComponentとClient Componentの違い」「Server Actionsの使い方」「revalidatePath/revalidateTagの違 — from to
tools
Next.js App RouterでのServer Components / Server Actions / Route Handlers等の使い分けガイド。「Server ComponentとClient Componentの違い」「Server Actionsの使い方」「revalidatePath/revalidateTagの違 — from ma
tools
Provides guidance and reusable assets for implementing navigation in Next.js App Router. Covers file-based routing, dynamic routes, layouts, loading/error UI, protected routes with
engineering
Comprehensive patterns for Next.js 14+ App Router architecture, Server Components, and modern full-stack React development.
engineering
Master Next.js 14+ App Router with Server Components, streaming, parallel routes, and advanced data fetching. Use when building Next.js applications, implementing SSR/SSG, or optim
engineering
Use when the user explicitly wants changed React or Next.js files audited against Vercel best practices with a bias toward high-impact issues.
engineering
Provides authentication implementation patterns for Next.js 15+ App Router using Auth.js 5 (NextAuth.js). Use when setting up authentication flows, implementing protected routes, m
engineering
Next.js App Router principles. Server Components, data fetching, routing patterns.
engineering
Secure Next.js BFF proxy/auth/session boundaries when editing app/api routes, middleware, cookie/session parsing, header forwarding, API_URL handling, or trusted network assumption
security
Advanced patterns for production Next.js web chatbots built with AI SDK 6 + ai-elements. Covers tool calling with human-in-the-loop (HITL) approval, PostgreSQL session persistence,
engineering
Provides comprehensive code review capability for Next.js applications, validates Server Components, Client Components, Server Actions, caching strategies, metadata, API routes, mi
engineering
Next.js 15 App Router patterns, React components, API routes, and state management for the Language Operator dashboard
engineering
Provides Next.js App Router data fetching patterns including SWR and React Query integration, parallel data fetching, Incremental Static Regeneration (ISR), revalidation strategies
engineering
SKILL.md files, not affiliated with, endorsed by, or sponsored by Anthropic.