A senior-level engineering skill for implementing flawless Clerk authentication and route protection in Next.js 15/16+ applications.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install sr-next-clerk-expert
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install sr-next-clerk-expert using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Sr. Next.js & Clerk Auth Expert?
This Openclaw Skills extension provides a comprehensive framework for integrating Clerk authentication into modern Next.js environments. It focuses on high-performance, SEO-friendly patterns that avoid common pitfalls like infinite redirect loops, slow static pages, and server-side errors on public routes.
By adhering to the strict technical patterns defined in this skill, developers can ensure a robust security posture while maintaining a seamless user experience. This includes implementing the Twelve Commandments of Clerk integration, which cover everything from route group organization to the proper use of client-side loading wrappers.
Sr. Next.js & Clerk Auth Expert Use Cases
- Implementing secure authentication in Next.js 15 and 16+ projects using modern standards.
- Protecting sensitive application routes using the (private) route group pattern.
- Debugging complex Clerk issues like handshake redirects, 500 errors, and middleware failures.
- Integrating Clerk with third-party services like Convex for databases or Stripe for subscription billing.
- Migrating legacy middleware.ts configurations to the modern proxy.ts standard recommended for newer Next.js versions.
How Sr. Next.js & Clerk Auth Expert Works
- The skill analyzes the project structure to ensure (private) route groups are utilized for protected content to maintain organized access control.
- It configures the ClerkProvider within the root layout to manage global authentication state and define critical redirect URLs.
- An optimized proxy.ts file is implemented to handle middleware-level route matching without impacting the performance of public marketing pages.
- Conditional rendering patterns are applied using ClerkLoaded and SignedIn components to prevent layout shifts and flashes of unauthorized content.
- Environment variables are strictly validated against the Clerk dashboard to prevent configuration-related failures during deployment.
Sr. Next.js & Clerk Auth Expert Setup
First, ensure you have your API keys from the Clerk Dashboard. Then, configure your environment variables in your .env.local file:
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_...
CLERK_SECRET_KEY=sk_test_...
Next, if you are using Next.js 16+, migrate your middleware to the new proxy format to ensure compatibility with modern Openclaw Skills workflows:
mv middleware.ts proxy.ts
Ensure your file structure includes an app/(private) directory for all authenticated routes to leverage this automation effectively.
Sr. Next.js & Clerk Auth Expert Data Schema & Taxonomy
The skill organizes authentication data and configuration according to the following schema to ensure reliability:
| Component | Location | Responsibility |
|---|---|---|
| Root Layout | app/layout.tsx | ClerkProvider initialization and global redirect configuration |
| Middleware | proxy.ts | Edge-level route protection and session verification logic |
| Private Routes | app/(private)/* | Authenticated views requiring server-side auth() checks |
| Public Routes | app/page.tsx | Static or marketing pages that avoid server-side auth for SEO |
Sr. Next.js & Clerk Auth Expert Advanced Features
- Seamless Convex Integration for real-time data synchronization with authenticated user sessions.
- Secure Stripe Billing flows integrated directly with Clerk user metadata and session tokens.
- Multi-tenant and Organization support for managing complex B2B application architectures.
- Automated Webhook verification using the svix library for reliable user data syncing between Clerk and your database.
- Advanced debugging protocols for resolving specific Next.js handshake and proxy configuration issues.
SKILL.md
Loading
Related Openclaw Skills
Senior Dev
A production-grade development workflow for AI agents that manages tasks, stacked PRs, and deployment verification.
Frontend Design
A high-performance skill for AI agents to generate production-ready, visually stunning frontend interfaces that break away from generic AI design patterns.
Delegation
An architecture-first development workflow that ensures every line of code justifies its existence within a system's strict design principles.
Starling Home Hub (Nest/Google Home)
A local REST API integration for managing Nest and Google Home devices through a Starling Home Hub.
Web Architecture
A high-performance multi-agent orchestration playbook for building TypeScript, Next.js, and Convex applications without architectural chaos.
SwiftFindRefs
A specialized CLI tool that queries Xcode IndexStoreDB to find every Swift file referencing a specific symbol.
Featured*
