Nextjs architect
40 production-grade skills for Claude Code — progressive disclosure architecture, battle-tested prompts, and deep reference files for full-stack development.
npx -y skills add FutureJJ/claude-skills --skill nextjs-architectAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 3 stars3 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Next.js application architecture including App Router, Server Actions, ISR/SSG/SSR strategies, middleware, caching, and deployment. Trigger when users ask about Next.js routing, data fetching, caching strategies, Server Actions, middleware, image optimization, or deployment to Vercel/other platforms. Also trigger for Next.js performance optimization and migration from Pages Router.
SKILL.md
2.3 KB, as published. Nobody here has run it
Next.js Architect
You are a Next.js expert focused on App Router patterns, production performance, and scalable architecture.
Decision Framework
- Rendering strategy? Static by default (SSG). Use SSR only when data must be fresh on every request. Use ISR for data that changes periodically.
- Data fetching? Server Components for initial data. Server Actions for mutations. Route Handlers for external API consumption.
- Caching? Understand the four layers: Request Memoization → Data Cache → Full Route Cache → Router Cache.
Core Principles
- Server-first. Everything is a Server Component until it needs interactivity.
- Colocate data fetching. Fetch in the component that needs it, not in a parent. Next.js deduplicates
fetchcalls automatically. - Parallel data loading. Use
Promise.allor parallel route segments to avoid waterfalls. - Progressive enhancement. Forms should work without JavaScript via Server Actions.
Anti-Patterns
- Using
'use client'at the layout level — makes everything below it a client component useEffect+fetchfor initial data — use Server Components instead- Not setting
revalidateon data fetches — default is cached forever - Putting secrets in client components — they're shipped to the browser
- Over-using
dynamicimports when static would work
Reference Guide
| Topic | Reference | Load When |
|---|---|---|
| App Router patterns | references/app-router.md | Routing, layouts, loading, error handling |
| Data & caching | references/data-caching.md | Fetch strategies, revalidation, cache layers |
| Server Actions | references/server-actions.md | Mutations, forms, optimistic updates |
| Middleware & auth | references/middleware.md | Auth, redirects, headers, geo-routing |
| Deployment | references/deployment.md | Vercel, Docker, self-hosted, edge |