skills.rest
RajAryanIITBHU
RajAryanIITBHUCOMMUNITY
Explore all skills by this author →
GitHub

clerk-nuxt-patterns

Protect Nuxt 3 routes and Nitro API endpoints with Clerk authentication middleware.

1|Updated Apr 11, 2026
Search Tags:#authentication#middleware#ssr#composables#clerk#nuxt#server-api
One-click install
npx skills add https://github.com/RajAryanIITBHU/bny --skill clerk-nuxt-patterns
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: clerk-nuxt-patterns
Source: https://github.com/RajAryanIITBHU/bny/tree/main/.continue/skills/clerk-nuxt-patterns
Command: npx skills add https://github.com/RajAryanIITBHU/bny --skill clerk-nuxt-patterns

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Provides clear, production-minded Nuxt 3 authentication patterns using @clerk/nuxt so teams can reliably protect pages, secure Nitro server API routes, and implement SSR-safe auth without guesswork.

Core Features & Use Cases

  • Auto-registered auth route protection using the built-in auth middleware and definePageMeta for pages.
  • Server API protection patterns that use event.context.auth or clerkClient to enforce authentication and return appropriate 401/403 responses.
  • Client composables (useAuth, useUser, useClerk) auto-imported for component-level reactive state, SSR-safe hydration advice, and organization-scoped flows such as org switching.
  • Practical guidance for common tasks: protecting dashboard pages, creating authenticated Nitro routes, building custom sign-in pages, and avoiding hydration mismatches.

Quick Start

Install and enable @clerk/nuxt, set the NUXT_PUBLIC_CLERK_PUBLISHABLE_KEY and NUXT_CLERK_SECRET_KEY environment variables, add modules: ['@clerk/nuxt'] to nuxt.config.ts, and protect your /dashboard page by adding definePageMeta({ middleware: 'auth' }).

Frequently Asked Questions about clerk-nuxt-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I protect Nuxt 3 routes and Nitro server API endpoints with Clerk authentication?▼

Protect Nuxt 3 routes by applying Clerk's built-in auth middleware via definePageMeta, and secure Nitro server API endpoints by validating event.context.auth or clerkClient to enforce authentication and return appropriate 401/403 responses.

What's the best way to avoid hydration mismatches when using Clerk composables in Nuxt 3 SSR?▼

To avoid hydration mismatches during Nuxt 3 SSR, follow SSR-safe rendering advice when using auto-imported Clerk composables like useAuth and useUser for component-level reactive state.

Do I need specific environment variables to configure Clerk authentication in a Nuxt 3 project?▼

Yes, configuring Clerk authentication requires setting the NUXT_PUBLIC_CLERK_PUBLISHABLE_KEY and NUXT_CLERK_SECRET_KEY environment variables, and adding modules: ['@clerk/nuxt'] to your nuxt.config.ts file.

Can I implement organization-aware flows and org switching using Clerk in Nuxt 3?▼

Yes, you can implement organization-scoped flows and org switching in Nuxt 3 using Clerk's auto-imported client composables, which support component-level reactive state for organization-aware application logic.

How does Clerk middleware handle unauthenticated access attempts on protected Nuxt 3 dashboard pages?▼

Clerk middleware handles unauthenticated access attempts on protected Nuxt 3 dashboard pages by leveraging proper environment variables to automatically redirect users to the configured sign-in page.

Related Skills

Explore More Software Engineering Skills→
Aditya07024Aditya07024

clerk-nuxt-patterns

Implement Clerk authentication patterns for Nuxt 3 applications with route protection.

Community
Intermediate
sudarshan-krishnansudarshan-krishnan

clerk-nuxt-patterns

Implement Nuxt 3 authentication patterns with @clerk/nuxt for route protection and SSR-safe state.

Community
Intermediate
SnakeOSnakeO
9

refactor:nuxtjs

Refactor Nuxt 3 codebases into modular components, composables, and Nitro routes.

Community
Advanced
clerkclerk
66

clerk-nuxt-patterns

Protects Nuxt 3 apps with Clerk authentication middleware and Nitro server route guards.

Official
Intermediate