Skills tagged "react" (185)

🎨 Nextjs App Router

This skill guides you through Next.js App Router patterns, server/client components, and routing files to read, review, or create app directory files.

nextjsreactfrontendfullstack

🎨 Og Images

This skill helps you generate OpenGraph and Twitter share images for Next.js by applying best-practice layout, fonts, and metadata.

nextjsseosocial-mediareact

🎨 Opentui Projects

This skill helps you scaffold OpenTUI projects with templates, examples, and best practices to accelerate learning and production-ready setups.

frontendclitypescriptdesign

🎨 Packages Documentation

This skill helps you generate and maintain comprehensive API documentation across core, rest, and graphql packages, improving discoverability and consistency.

docsapiwritingtypescript

🎨 Perf Optimizer

This skill helps diagnose and optimize OneKey mobile performance by guiding baseline setup, iterative bottleneck fixes, and verifications against thresholds.

performancedebuggingreact-nativeanalytics

🎨 Perf Virtual Lists

This skill optimizes performance for virtualized lists on Android TV by applying React Window techniques and overscan, ensuring smooth 60FPS.

reactperformancefrontend

🛡️ Plan Viz

This skill visualizes planned changes as ASCII diagrams with risk, execution order, and impact metrics to inform review.

planningaidataanalytics

🧪 Pr Fix

This skill orchestrates PR fixes by resolving review comments and CI failures, coordinating tasks, and pushing updates to GitHub.

code-reviewci-cdtestingautomation

🧪 Pr Rebase

This skill rebases the current branch on the latest upstream changes, resolves conflicts, and pushes, saving time and ensuring a clean PR history.

gitautomationdevopsscripting

🎨 Pricing Ui

This skill helps you build pricing UIs with Flowglad by loading, formatting, and highlighting plans and current subscriptions.

reactnextjstrpctypescript

🎨 Project Health

This skill audits AI readiness of project docs and workflows to ensure future Claude Code sessions can understand, execute, and resume work.

aiautomationdocsproductivity

🎨 Pwa Development

This skill helps you implement Progressive Web App features for React and Svelte, enabling offline support, service workers, and installable web apps.

frontendsveltereactdebugging

🎨 React

This skill helps you locate React official docs and tutorials, guiding you through concepts, hooks, and patterns with authoritative references.

reactfrontenddocs

🎨 React 19

This skill helps you adopt React 19 patterns and deprecations, guiding component and hook updates for server-first rendering and compiler-assisted optimization.

reactfrontendperformancemigration

🎨 React Best Practices

This skill helps you optimize React and Next.js performance by applying high-impact best practices across components, pages, and data fetching.

reactnextjsperformance

🎨 React Effects Audit

This skill audits React code for unnecessary useEffect patterns, flags anti-patterns, and suggests fixes with severity levels.

reactdebuggingcode-reviewperformance

🎨 React Email

This skill helps you rapidly scaffold and preview React Email templates for transactional emails across clients.

reactfrontendtailwindtypescript

🎨 React Native Best Practices

This skill helps you optimize React Native apps by applying proven performance guidelines for FPS, TTI, bundle size, and memory management.

react-nativeperformancedebuggingexpo

🎨 React Patterns

This skill helps optimize React and Next.js performance for local or docker deployments by applying Vercel best practices and patterns.

reactnextjsperformancedocker

🎨 React Performance Patterns

This skill helps you boost React performance by applying memoization, code splitting, virtualization, and optimized context usage based on real-world patterns.

reactperformancecode-review

🧪 React State Driven Ui

This skill helps you build predictable React UI by projecting state through reducers and events, reducing bugs and improving testability.

reactfrontendtestingdebugging

🧪 React Tanstack Testing

This skill provides comprehensive TanStack testing patterns for React apps, including mocks, router validation, and query behavior with Vite and Vitest.

testingfrontendreactdebugging

🎨 React Typescript

This skill helps you build type-safe React 19 apps with TypeScript by applying patterns, editor tooling, and the React Compiler.

reacttypescriptfrontendrefactor

🎨 React Use Callback

This skill helps you optimize React performance by applying useCallback best practices to memoized components and effect dependencies.

reactperformancedebuggingrefactor

🎨 Redux Best Practices

This skill enforces Redux best practices and patterns using RTK, guiding store setup, slices, selectors, thunks, and React-Redux hooks.

reacttypescriptdebuggingcode-review

🎨 Refactoring Ui

This skill helps you apply Refactoring UI principles to create clean, scalable frontends with consistent spacing, typography, color, and depth.

frontenddesignuxrefactor

🎨 Remixjs Best Practices

This skill helps you adopt Remix best practices with React Router v7, server-first data loading, and robust error handling strategies.

remixreactmigrationperformance

🎨 Remotion

This skill generates Remotion walkthrough videos from Stitch screens, applying smooth transitions, zoom effects, and contextual text overlays for engaging

reacttypescriptdesignfrontend

🎨 Remotion

This skill helps you apply Remption best practices to build maintainable, high-quality video projects with React and TypeScript.

reacttypescriptfrontendperformance

🎨 Remotion Best Practices

This skill helps you implement Remotion best practices across animations, assets, compositions, and timing for high-quality video projects.

reacttypescriptfrontenddesign

🎨 Remotion Editor Skill

This skill guides building Remotion-based video editors, covering timeline math, state management, AI integration, and performance optimizations for 60fps

frontendreactperformanceai

🎨 Remotion Render

This skill renders Remotion TSX code into MP4 videos via inference.sh, enabling automated, programmable video generation from React components.

reactcliautomationscripting

🎨 Remotion Spline

This skill generates and animates smooth spline paths in Remotion using linear and Catmull-Rom splines for SVG paths.

frontendreacttypescriptperformance

🎨 Remotion Video Toolkit

This skill helps you generate production-ready Remotion videos by composing React components, animations, and data-driven rendering pipelines.

reactfrontendcloudautomation

🎨 Review Docs

This skill reviews and improves documentation through parallel evaluation and iterative fixes, enhancing accuracy, readability, and completeness for technical

docswritingcontentcode-review

🎨 Rivetkit Client React

This skill helps React developers connect to Rivet Actors using @rivetkit/react, create hooks with createRivetKit, and manage realtime actor state.

reactfrontendtypescriptwebsocket

🎨 Seo Optimization Guide

This skill helps you implement comprehensive SEO strategies covering technical SEO, on-page optimization, and core web vitals to boost rankings and UX.

seoperformancefrontendnextjs

🎨 Setup

This skill installs and configures Flowglad SDK for Next.js, Express, and React apps, guiding framework detection, env setup, and provider integration.

nextjsexpressreactbackend

🎨 Setup React Native Storybook

This skill helps you add and configure Storybook for React Native across Expo, React Native CLI, and Re.Pack projects, boosting component-driven development.

react-nativeexpotypescriptdebugging

🎨 Shadcn Layouts

This skill helps you generate correct shadcn/Tailwind layouts by applying CSS layout mental models to ensure scrolling, height, and grid correctness.

shadcnfrontendreacttypescript

🎨 Shadcn Ui

This skill guides you through setting up shadcn/ui, installing components, and building accessible, Tailwind-styled React UI patterns.

reactshadcnaccessibilityux

🎨 Shadcn Ui

This skill helps you discover, install, and customize shadcn/ui components in your project with best practices and zero runtime overhead.

frontendreacttypescripttailwind

🎨 Shadcn Ui

This skill guides you in adding, customizing, and troubleshooting shadcn/ui components with CVA, theming, and architecture guidance.

shadcnfrontendtailwindreact

🎨 Shopify Pos

This skill helps you build Shopify POS UI extensions to add tiles, modals, and blocks across the smart grid and product screens.

frontendreactapiperformance

🎨 Skill

This skill guides you through integrating AIRIOT client features for API, auth, forms, state, real-time data, and configuration to accelerate frontend

frontendapireacttypescript

🎨 Subscriptions

This skill helps you manage subscription lifecycles by handling upgrades, downgrades, cancellations, and reactivations with correct billing behavior.

backendapitypescriptnextjs

🎨 Swarm Pr Review

This skill coordinates a three-expert swarm to review a PR diff, surface high impact issues, and deliver a consensus merge verdict.

aicode-reviewtypescriptfrontend

🎨 Tamagui V2

This skill guides building cross platform apps with Tamagui, covering styled components, tokens, theming, and premium Bento/Takeout components for web and

reactreact-nativeexpoperformance

🎨 Tanstack

This skill helps you build type-safe React apps with TanStack Query, Router, and Start, enabling server state, routing, and SSR.

reactfullstackfrontendapi

🎨 Tanstack Query Hook

This skill generates complete TanStack Query v5 hooks for data fetching and mutations in TypeScript projects.

typescriptfrontendbackenddata

🎨 Tw React Components

This skill helps you build polished React dashboards using tw-react-components with TailwindCSS, providing ready-made UI, hooks, and layout patterns.

reactfrontendtypescriptdesign

🎨 Ui Design Styling

This skill helps you design and style UI components across the four OS themes, ensuring consistent retro aesthetics and theme-aware behavior.

designuxfrontendreact

🎨 Ui Ux Pro Max

This skill helps you design and implement polished frontend UI/UX for pages, dashboards, and apps with best-practice guidelines.

designuxfrontendtailwind

🎨 Usage Tracking

This skill helps you implement usage-based billing with Flowglad by recording usage events, checking balances, and displaying usage information.

apibackendnextjstypescript

🎨 Use Store Not Props Best Practice

This skill analyzes components and rewrites them to fetch data directly from the store, reducing prop usage and enhancing maintainability.

frontendreactrefactorcode-review

🧪 Velt Crdt Best Practices

This skill helps implement real-time collaboration with Velt CRDT by guiding setup, integration, and debugging across editors and stores.

reactdebuggingtestingtypescript

🎨 Vercel Composition Patterns

This skill guides React developers in refactoring with composition patterns to reduce boolean props and build scalable, reusable component APIs.

reactfrontendrefactorcode-review

🎨 Vercel React Best Practices

This skill applies Vercel React and Next.js best practices to optimize performance in components, pages, and data fetching.

reactnextjsperformanceai

🎨 Vite

This skill configures and optimizes Vite 7 for React projects, guiding plugin order, environment handling, and rolldown integration.

reactfrontendperformancedevops

🎨 Web Frameworks

This skill helps you build and optimize modern full-stack web apps using Next.js, Turborepo, and RemixIcon for efficient monorepos and scalable UI.

nextjsremixreactfullstack