Frontend Development (1023 — page 13)

🎨 React Hooks Patterns

Master React Hooks including useState, useEffect, useContext, useReducer, and custom hooks with production-grade patterns

pluginagentmarketplacefrontend

🎨 React Integration

This skill helps you build a React frontend with the agent runtime by wiring providers, hooks, and streaming chat UI for real-time conversations.

frontendfullstackapi

🎨 React Native

This skill helps you find React Native documentation on releases and the new architecture, guiding you to relevant sections and usage details.

react-nativedocsdebuggingrelease

🎨 React Native Basics

Master React Native fundamentals - components, styling, layout, and Expo

pluginagentmarketplacefrontend

🎨 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 Native Design

This skill helps you build performant cross-platform mobile apps with expert styling, navigation, and animated UI using React Native and Reanimated.

designuxfrontendperformance

🎨 React Native Navigation

Master React Navigation - stacks, tabs, drawers, deep linking, and TypeScript integration

pluginagentmarketplacefrontend

🎨 React Native Skills

This skill helps optimize React Native apps by applying best practices for list performance, animations, and native integrations across Expo and RN.

performancefrontendmonitoring

🎨 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

Master React performance optimization with memoization, code splitting, profiling, and Web Vitals monitoring

pluginagentmarketplacefrontend

🎨 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 Router

Master React Router v6 for production routing with error boundaries, lazy loading, and navigation guards

pluginagentmarketplacefrontend

🎨 React Router

React Router v7 Data Mode for Vite SPA with Convex backend. Triggers on routing, navigation, nested routes, protected routes, lazy loading. Use for client-side routing in Vite React apps.

sebastiaanwoutersfrontend

🎨 React Starter Skill

This skill scaffolds modern React projects with a production-ready stack of Vite, Tailwind, React Router, Lingui, and related tooling.

frontendproductivitycliscripting

🎨 React Three Game

react-three-game, a JSON-first 3D game engine built on React Three Fiber, WebGPU, and Rapier Physics.

prnthhfrontend

🎨 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

🎨 React Use Hooks

This skill applies react-use hooks to build concise, maintainable React features, mapping requirements to optimal hooks for readability, performance, and reuse.

frontendperformanceproductivityrefactor

🎨 React Useeffect

This skill guides you on when to use React useEffect, optimize data fetching, and apply alternatives for derived state and events.

frontendperformancerefactorcode-review

🎨 React Web

Modern React 19+ development with Server Components, Actions, hooks, TypeScript integration, and performance optimization. Use when building React web applications, implementing Server Components, using Actions for form handling, working with new hooks (use, useActionState, useOptimistic, useFormSta

ibuttersfrontend

🎨 React19 Patterns

This skill helps you apply React 19 patterns and best practices to optimize components, state, and rendering for faster, maintainable UI.

frontendperformancerefactorcode-review

🎨 Reactive Polling

This skill lets you monitor a value with a useReactive hook and trigger React re-renders when the value changes.

frontendperformancedebugging

🎨 Readme Writing

This skill helps write folder READMEs by explaining why the folder exists, its mental model, and how to place future code within the structure.

docswritingplanningfrontend

🎨 Reanimated Skia Performance

Write and review high-performance React Native animations and 2D graphics using react-native-reanimated (v4+) and @shopify/react-native-skia (Canvas scenes, runtime effects/shaders). Use for: gesture-driven interactions, spring/timing transitions, layout/mount animations, Reanimated CSS transitions/

andreev-danilafrontend

🎨 Recent Data

This skill helps you efficiently access and manage recently used topics, resources, and pages with session-store guidance and type-safe patterns.

frontenddataanalyticsproductivity

🎨 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

🎨 Refactor Flutter

This skill refactors Flutter/Dart code to improve maintainability, readability, and performance using Dart 3 features, modern state management, and clean

refactorfrontendperformancecode-review

🎨 Refactoring Ui

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

frontenddesignuxrefactor

🎨 Reka Ui

This skill helps you build accessible, headless Vue components with Reka UI by guiding patterns, state management, virtualization, and styling integration.

frontendaccessibilityperformancedocs

🎨 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

Best practices for Remotion - Video creation in React. Includes Launchpad monorepo components and CUA integration.

vapvarunfrontend

🎨 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 Best Practices Zh

This skill helps you apply Remotion best practices in Chinese, guiding composition, timing, assets, captions, and transitions for polished videos.

remixtypescriptfrontenddocs

🎨 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 Expert

This skill enables programmatic, frame-precise Remotion video generation with AI-driven workflows and dynamic data for high-fidelity 2026 productions.

aiautomationfrontendperformance

🎨 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 Creator

This skill helps you create animated videos with Remotion by turning UI concepts into TSX scenes, complete with transitions and exports.

frontenddesignuxautomation

🎨 Remotion Video Toolkit

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

reactfrontendcloudautomation

🎨 Rendering Rsc

This skill helps you maximize SEO and minimize rendering flicker by favoring server components and strategic hydration safeguards.

frontendperformanceseoanalytics

🎨 Repomix Reference Black Tortoise

This skill helps you understand the Black Tortoise codebase structure, locate implementations, and read source files across a large TypeScript project.

code-reviewdebuggingdocsbackend

🎨 Research

This skill orchestrates parallel intelligence gathering across codebase, history, and web sources to produce a structured research task file.

researchfrontenddocsai

🎨 Responsive Web Design

This skill helps you design responsive web interfaces with mobile-first CSS, flexible grids, and fluid typography across devices.

frontenduxdesignaccessibility

🎨 Review Docs

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

docswritingcontentcode-review

🎨 Rhdh Context

This skill provides essential context on Red Hat Developer Hub, its relation to Backstage, and how to develop and deploy RHDH plugins.

backendfrontenddocskubernetes

🎨 Rhdh Frontend Dynamic Plugin

This skill guides you to bootstrap and wire frontend dynamic plugins for Red Hat Developer Hub, delivering UI pages, routes, and theme integrations.

frontenduxdesignproductivity

🎨 Rive React

Trigger when: (1) Using @rive-app/react-canvas or @rive-app/react-webgl, (2) Using useRive hook or RiveComponent, (3) Building React components with Rive animations, (4) User mentions "Rive React" or "useRive", (5) Implementing scroll-based or parallax animations with Rive. Best practices for integr

stevysmithfrontend

🎨 Rive Skills

This skill helps you integrate and control Rive animations in React/Next.js apps, write Luau scripts, and drive state machines for interactive graphics.

frontendapidebuggingdata

🎨 Rive Web

Trigger when: (1) Loading or embedding .riv files on the web, (2) Using @rive-app/canvas or @rive-app/webgl packages, (3) Controlling Rive state machines from JavaScript, (4) Reading/writing Rive inputs or handling events, (5) User mentions "Rive runtime" or "Rive animation" in web context. Best pra

stevysmithfrontend

🎨 Rivetkit Client Javascript

This skill guides building JavaScript RivetKit clients for browser, Node.js, or Bun, enabling easy actor calls and real-time connections.

frontendbackendapijavascript

🎨 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

🎨 Rmslop

This skill removes AI-generated slop by diff-checking main and pruning inconsistent or unnecessary code patterns across the repository.

code-reviewrefactorlintingdebugging

🎨 Robis Design Best Practice

Apply Robi's UI design principles for beautiful, accessible interfaces. Use when building UI components, reviewing designs, choosing colors, setting spacing, or implementing animations. Covers color theory (HSL, WCAG, halation), spacing (4px system), icons, shadows, and micro-interactions.

ethiopian-cursor-communityfrontend

🎨 Rsc Data Optimizer

This skill converts slow client-side data fetching to server-side rendering with React Server Components to speed up initial load and improve SEO.

frontendbackendfullstackperformance

🎨 Rss Agent Viewer

This skill helps you manage RSS feeds from the terminal by discovering, subscribing, reading, and searching across feeds.

cliscriptingproductivitydata

🎨 Runtime Env Vite Plugin

This skill helps you apply runtime-env with Vite by distinguishing build-time and runtime variables, ensuring safe migration and correct configuration.

typescriptjavascriptfrontendmigration

🎨 Salla Docs

This skill provides comprehensive Salla documentation across APIs, storefront SDKs, and theme development to help you integrate and build quickly.

apidocsfrontend

🎨 Sass

Sass/SCSS preprocessing with variables, mixins, and nesting. Use when organizing styles, creating reusable components, or implementing design systems.

simon-jarillofrontend