NextJS

Build Next.js 15 apps with App Router, server components, caching, auth, and production patterns.

Security Scan

The skill's instructions, files, and requirements are coherent with a Next.js guidance assistant; it is instruction-only, asks for no credentials or installs, and only persists project memory under ~/nextjs.

Purpose & Capability

The name/description (Next.js guidance) matches the provided SKILL.md and topic files (routing, caching, auth, deployment). There are no unrelated required binaries, environment variables, or install steps that don't belong to a Next.js helper.

Instruction Scope

The runtime instructions and setup explicitly tell the agent to save project and user preferences to ~/nextjs/memory.md and per-project files. That is consistent with a persistent helper that remembers conventions, but it does mean the agent will read/write files under the user's home directory. The docs otherwise stay within Next.js-related activities and do not instruct reading unrelated system files or exfiltrating data.

Install Mechanism

No install spec or code files to execute; this is instruction-only, so nothing is downloaded or installed by the skill itself.

Credentials

The skill declares zero required env vars or credentials. Some included example docs reference typical Next.js project secrets (DATABASE_URL, NEXTAUTH_SECRET, SENTRY_DSN, VERCEL_TOKEN) as implementation examples — appropriate for a Next.js guide and not requested by the skill itself.

Persistence & Privilege

always:false (no forced global inclusion). The skill instructs the agent to create and maintain a persistent memory directory ~/nextjs/ to store project conventions and learned patterns. This is expected for a helper that maintains state, but users should be aware of that persistent storage and its contents.

Assessment

This is an instruction-only Next.js guidance skill that appears to do what it says. Important things to consider before installing: - Persistence: the skill will save memory and project metadata to ~/nextjs/ (memory.md and per-project .md files). If you keep private data in your home directory, review what the agent writes there and remove it if undesired. - No credentials requested: the skill itself does not ask for API keys or environment variables. The documentation includes examples that reference common project secrets (DATABASE_URL, NEXTAUTH_SECRET, SENTRY_DSN, VERCEL_TOKEN) — those are examples for your Next.js projects and are not required by the skill. - Proactive behavior: setup.md encourages saving preferences and being proactive. Decide whether you want the agent to act proactively (flagging issues) or only on request, and adjust the skill's memory or activation settings accordingly. - Review created files: after enabling the skill, check ~/nextjs/ for stored memory files and project notes so you know what data the agent kept. If you want to limit persistence, either decline the memory/storage step, delete ~/nextjs/ after sessions, or run the skill in a profile/environment where home-directory writes are acceptable.

Setup

On first use, read setup.md for project integration.

When to Use

User needs Next.js expertise — routing, data fetching, caching, authentication, or deployment. Agent handles App Router patterns, server/client boundaries, and production optimization.

Architecture

Project patterns stored in ~/nextjs/. See memory-template.md for setup.

~/nextjs/
├── memory.md          # Project conventions, patterns
└── projects/          # Per-project learnings

Quick Reference

Topic	File
Setup	setup.md
Memory template	memory-template.md
Routing (parallel, intercepting)	routing.md
Data fetching & streaming	data-fetching.md
Caching & revalidation	caching.md
Authentication	auth.md
Deployment	deployment.md

Core Rules

1. Server Components by Default

Everything is Server Component in App Router. Add 'use client' only for useState, useEffect, event handlers, or browser APIs. Server Components can't be imported into Client — pass as children.

2. Fetch Data on Server

Fetch in Server Components, not useEffect. Use Promise.all for parallel requests. See data-fetching.md for patterns.

3. Cache Intentionally

fetch is cached by default — use cache: 'no-store' for dynamic data. Set revalidate for ISR. See caching.md for strategies.

4. Server Actions for Mutations

Use 'use server' functions for form submissions and data mutations. Progressive enhancement — works without JS. See data-fetching.md.

5. Environment Security

NEXT_PUBLIC_ exposes to client bundle. Server Components access all env vars. Use .env.local for secrets.

6. Streaming for Large Data

Use <Suspense> boundaries to stream content progressively. Wrap slow components individually. See data-fetching.md.

7. Auth at Middleware Level

Protect routes in middleware, not in pages. Middleware runs on Edge — lightweight auth checks only. See auth.md.

Server vs Client

Server Component	Client Component
Default in App Router	Requires 'use client'
Can be async	Cannot be async
Access backend, env vars	Access hooks, browser APIs
Zero JS shipped	JS shipped to browser

Decision: Start Server. Add 'use client' only for: useState, useEffect, onClick, browser APIs.

Common Traps

Trap	Fix
router.push in Server	Use redirect()
<Link> prefetches all	prefetch={false}
next/image no size	Add width/height or fill
Metadata in Client	Move to Server or generateMetadata
useEffect for data	Fetch in Server Component
Import Server→Client	Pass as children/props
Middleware DB call	Call API route instead
Missing await params (v15)	Params are async in Next.js 15

Next.js 15 Changes

• params and searchParams are now Promise — must await
• fetch not cached by default — opt-in with cache: 'force-cache'
• Use React 19 hooks: useActionState, useFormStatus

Related Skills

Install with clawhub install <slug> if user confirms:

• react — React fundamentals and patterns
• typescript — Type safety for better DX
• prisma — Database ORM for Next.js apps
• tailwindcss — Styling with utility classes
• nodejs — Server runtime knowledge

Feedback

• If useful: clawhub star nextjs
• Stay updated: clawhub sync