reactFull React 19 engineering, architecture, Server Components, hooks, Zustand, TanStack Query, forms, performance, testing, production deploy.
Install via ClawdBot CLI:
clawdbot install ivangdavila/reactGrade Good — based on market validation, documentation quality, package completeness, maintenance status, and authenticity signals.
Calls external URL not in known-safe list
https://clawic.com/skills/reactAudited Apr 17, 2026 · audit v1.0
Generated Mar 1, 2026
Building a server-rendered product catalog using React 19 Server Components to fetch data directly from a database, with client-side interactivity for filtering and adding items to cart. Uses TanStack Query for server state and Zustand for shared UI state like cart management, optimizing performance with code splitting and image optimization.
Developing a dashboard with dynamic charts and tables that update in real-time via WebSockets, using React hooks for state management and TanStack Query for API data caching. Implements virtualized lists for handling large datasets and debouncing for expensive operations to ensure smooth user interactions.
Creating a secure patient portal with forms for appointment booking and medical history viewing, using React Hook Form with Zod for validation and React 19's useActionState for server-side form handling. Ensures performance with route-based code splitting and adheres to component rules for maintainability.
Implementing an infinite-scrolling feed using React 19 Server Components for initial data loading and client components for interactions like liking and commenting. Leverages TanStack Query for paginated data fetching and Zustand for managing user session state, with performance optimizations like memoization and image lazy loading.
Building an admin panel with CRUD operations for user management, using React 19 for hybrid rendering with SSR for SEO and client-side state for UI controls. Employs TanStack Query for API state and Zustand for shared settings, following architecture decisions for scalable folder structure and component extraction.
Offering a React-based application with tiered subscription plans for features like advanced analytics or custom integrations. Revenue is generated through monthly or annual fees, leveraging React's performance optimizations to handle high user loads and ensure uptime.
Operating a platform where third-party sellers list products, with revenue from transaction fees, commissions, or premium seller subscriptions. Uses React for a fast, responsive frontend with server components for product data and client components for checkout processes.
Providing bespoke React development services for clients across industries, with revenue from project-based contracts or retainer fees. Leverages the skill's architecture and performance guidelines to deliver high-quality, maintainable applications efficiently.
💬 Integration Tip
Integrate this skill by first setting up the architecture decisions like rendering mode and state management, then apply component rules and performance techniques to build scalable applications.
Scored Sep 7, 2026
Use when building UI with shadcn/ui components, Tailwind CSS layouts, form patterns with react-hook-form and zod, theming, dark mode, sidebar layouts, mobile navigation, or any shadcn component question.
Tailwind reference tool. Use when working with tailwind in frontend contexts.
A product creation skill based on the "Bee Website Builder" Open API. It is used to create a new product under a specified site language and product group, w...
A product update skill based on the "Bee Website Builder" Open API. It is used to update an existing product under a specified site language and supports upd...
Build WCAG 2.1 AA compliant websites with semantic HTML, proper ARIA, focus management, and screen reader support. Includes color contrast (4.5:1 text), keyboard navigation, form labels, and live regions. Use when implementing accessible interfaces, fixing screen reader issues, keyboard navigation, or troubleshooting "focus outline missing", "aria-label required", "insufficient contrast".
Use when building Vue 3 applications with Composition API, Nuxt 3, or Quasar. Invoke for Pinia, TypeScript, PWA, Capacitor mobile apps, Vite configuration.