tomevault-io/skills-registry - Page 173

configuring-image-optimization

Teach image optimization configuration changes in Next.js 16. Use when configuring images, troubleshooting image loading, or migrating image settings. Use when this capability is needed.

configuring-serverless-clients

Configure PrismaClient for serverless (Next.js, Lambda, Vercel) with connection_limit=1 and global singleton pattern. Use when this capability is needed.

configuring-tailwind-v4

Configure Tailwind CSS v4 using Vite plugin, PostCSS, or CLI with CSS-first configuration via @import and @theme directives. Use when setting up new projects or migrating build tools. Use when this capability is needed.

configuring-vitest-4

Configure Vitest 4.x with correct pool architecture, coverage settings, and multi-project setup. Use when creating or modifying vitest.config files or setting up test infrastructure. Use when this capability is needed.

creating-client-singletons

Prevent multiple PrismaClient instances that exhaust connection pools causing P1017 errors. Use when creating PrismaClient, exporting database clients, setting up Prisma in new files, or encountering connection pool errors. Critical for serverless…

creating-custom-utilities

Create custom utilities with @utility directive supporting static utilities, functional utilities with values, theme-based utilities, and multi-value utilities. Use when extending Tailwind with custom CSS properties or patterns. Use when this capability is…

following-the-rules-of-hooks

Fix React Rules of Hooks violations - conditional calls, hooks in loops/callbacks/classes Use when this capability is needed.

hashing-passwords

CRITICAL security skill teaching proper credential and password handling. NEVER store passwords, use bcrypt/argon2, NEVER accept third-party credentials. Use when handling authentication, passwords, API keys, or any sensitive credentials. Use when this…

implementing-parallel-routes

Teach parallel routes and slot patterns in Next.js 16. Use when implementing parallel routes, working with @slot syntax, or encountering missing default.tsx errors. Use when this capability is needed.

implementing-query-caching

Implement query result caching with Redis and proper invalidation strategies for Prisma 6. Use when optimizing frequently accessed data, improving read-heavy application performance, or reducing database load through caching. Use when this capability is…

implementing-query-pagination

Implement cursor-based or offset pagination for Prisma queries. Use for datasets 100k+, APIs with page navigation, or infinite scroll/pagination mentions. Use when this capability is needed.

integrating-zod-frameworks

Integrate Zod v4 with React Hook Form, Next.js, Express, tRPC, and other frameworks for type-safe validation Use when this capability is needed.

managing-client-lifecycle

Manage PrismaClient lifecycle with graceful shutdown, proper disconnect timing, and logging configuration. Use when setting up application shutdown handlers, configuring logging for development or production, or implementing proper connection cleanup in…

managing-local-vs-global-state

Teaches when to use local state vs global state (Context) in React 19. Use when deciding state management strategy, avoiding prop drilling, or architecting component state. Use when this capability is needed.

migrating-async-request-apis

Teach async request APIs in Next.js 16 - params, searchParams, cookies(), headers(), draftMode() are now async. Use when migrating from Next.js 15, fixing type errors, or working with request data. Use when this capability is needed.

migrating-from-forwardref

Teaches migration from forwardRef to ref-as-prop pattern in React 19. Use when seeing forwardRef usage, upgrading React components, or when refs are mentioned. forwardRef is deprecated in React 19. Use when this capability is needed.

migrating-middleware-to-proxy

Teach middleware.ts to proxy.ts migration in Next.js 16. Use when migrating middleware, encountering middleware errors, or implementing request proxying. Use when this capability is needed.

migrating-v3-to-v4

Complete migration guide from Zod v3 to v4 covering all breaking changes and upgrade patterns Use when this capability is needed.

optimizing-with-react-compiler

Teaches what React Compiler handles automatically in React 19, reducing need for manual memoization. Use when optimizing performance or deciding when to use useMemo/useCallback. Use when this capability is needed.

preventing-error-exposure

Prevent leaking database errors and P-codes to clients. Use when implementing API error handling or user-facing error messages. Use when this capability is needed.

resolving-type-errors

Resolve all TypeScript errors using root cause analysis, targeted fixes, and mandatory validation Use when this capability is needed.

reviewing-duplication

Automated tooling and detection patterns for identifying duplicate and copy-pasted code in JavaScript/TypeScript projects. Provides tool commands and refactoring patterns—not workflow or output formatting. Use when this capability is needed.

reviewing-hook-patterns

Review React hook usage for React 19 compliance and best practices Use when this capability is needed.

reviewing-nextjs-16-patterns

Review code for Next.js 16 compliance - security patterns, caching, breaking changes. Use when reviewing Next.js code, preparing for migration, or auditing for violations. Use when this capability is needed.

reviewing-patterns

Review Zod schemas for correctness, performance, and v4 best practices Use when this capability is needed.

reviewing-performance-patterns

Review React 19 performance patterns including memoization, re-renders, and bundle size. Use when reviewing performance or optimization. Use when this capability is needed.

reviewing-state-management

Review state management patterns for React 19 best practices. Use when reviewing component state, Context usage, or state architecture. Use when this capability is needed.

reviewing-tailwind-patterns

Review Tailwind CSS v4 patterns for configuration, theming, and utility usage. Use when reviewing CSS files, Vite configs, or components using Tailwind. Use when this capability is needed.

reviewing-vitest-config

Review Vitest configuration for deprecated patterns and best practices. Use when reviewing test configuration or vitest setup. Use when this capability is needed.

securing-server-actions

Teach server action authentication and security patterns in Next.js 16. Use when implementing server actions, form handlers, or mutations that need authentication. Use when this capability is needed.

supporting-custom-elements

Teaches Web Components (Custom Elements) support in React 19, including property vs attribute handling and custom events. Use when integrating Web Components or working with custom HTML elements. Use when this capability is needed.

testing-components

Teaches React Testing Library patterns for React 19 components. Use when writing component tests, testing interactions, or testing with Server Actions. Use when this capability is needed.

testing-hooks

Teaches testing custom hooks in React 19 using renderHook from React Testing Library. Use when testing custom hooks or hook behavior. Use when this capability is needed.

testing-server-actions

Teaches testing Server Actions in isolation in React 19. Use when testing Server Actions, form handling, or server-side logic. Use when this capability is needed.

tracking-form-status

Teaches useFormStatus hook for tracking form submission state in React 19. Use when implementing submit buttons, form loading states, or pending indicators. Use when this capability is needed.

transforming-string-methods

Write type-safe transformations with Zod including string methods, custom transforms, codecs, and pipelines Use when this capability is needed.

upgrading-to-prisma-6

Migrate from Prisma 5 to Prisma 6 handling breaking changes including Buffer to Uint8Array, implicit m-n PK changes, NotFoundError to P2025, and reserved keywords. Use when upgrading Prisma, encountering Prisma 6 type errors, or migrating legacy code. Use…

using-browser-mode

Set up Vitest browser mode with Playwright or WebDriverIO providers, use page and userEvent APIs, test components. Use when testing browser-specific code or UI components. Use when this capability is needed.

using-cache-lifecycle-apis

Teach cache lifecycle APIs in Next.js 16 - cacheLife(), cacheTag(), updateTag(), refresh(), revalidateTag(). Use when managing cache invalidation, setting cache policies, or implementing cache tags. Use when this capability is needed.

using-container-queries

Use container queries for component-based responsive design with @container syntax and named containers. Use when building portable, reusable components that adapt to parent size instead of viewport. Use when this capability is needed.