Is this skill useful for fixing SSR hydration issues?

Absolutely. It includes specific patterns for guarding browser-only APIs using import.meta.client, onMounted, and SSR-safe state management with VueUse.

How does it handle server-side validation?

It utilizes h3 v2+ utilities like getValidatedQuery and readValidatedBody combined with Zod schemas for robust, type-safe validation that exports schemas for client use.

Does this skill support Nuxt 3.14+ features?

Yes, it includes patterns for Nuxt 3.14+ such as shared directories, enhanced fetch options (retry, dedupe, delay), and Nitro tasks.

Can this skill help with authentication implementation?

Yes, it provides patterns for using nuxt-auth-utils, including OAuth, WebAuthn, session management, and server-side auth middleware.

Why shouldn't I use generic type parameters with useFetch?

Using generic parameters manually defeats Nitro's automatic type inference; this skill teaches you how to let Nuxt infer types directly from your API handlers to ensure frontend and backend stay in sync.

Nuxt 3 Nitro API Patterns

Name: Nuxt 3 Nitro API Patterns
Author: gallop-systems

bygallop-systems

API 개발

Builds type-safe Nuxt 3 applications using standardized Nitro API patterns, server-side validation, and advanced fetch implementations.

소개

This skill optimizes the development of Nuxt 3 applications by enforcing best practices for Nitro backends and full-stack type safety. It provides Claude with domain-specific knowledge on implementing Zod validation with h3, managing complex fetch patterns, handling server-side rendering (SSR) safely, and integrating authentication using nuxt-auth-utils. By following these patterns, developers can ensure their applications maintain perfect type inference between the server and client while minimizing boilerplate and preventing common SSR hydration errors.

주요 기능

Optimized fetch patterns for SSR and client-side data fetching
Real-time communication patterns using Server-Sent Events (SSE) and Nitro tasks
Robust server-side validation using Zod and h3 standard schemas
Secure authentication implementation with nuxt-auth-utils and middleware
0 GitHub stars
End-to-end type safety through automatic Nitro route inference

사용 사례

Implementing real-time data streaming and background processing in Vue applications
Building enterprise-grade Nuxt 3 dashboards with strict TypeScript requirements
Architecting secure, authenticated API layers within a Nitro-powered backend

소개

주요 기능

Optimized fetch patterns for SSR and client-side data fetching
Real-time communication patterns using Server-Sent Events (SSE) and Nitro tasks
Robust server-side validation using Zod and h3 standard schemas
Secure authentication implementation with nuxt-auth-utils and middleware
0 GitHub stars
End-to-end type safety through automatic Nitro route inference

사용 사례

Implementing real-time data streaming and background processing in Vue applications
Building enterprise-grade Nuxt 3 dashboards with strict TypeScript requirements
Architecting secure, authenticated API layers within a Nitro-powered backend