FrankLord27FrankLord27/ai-lordkit/skills/nextjs-docs/SKILL.md

nextjs-docs

Skill2 starsChanged 17 days agoMITView on GitHub

Documentación de Next.js 16 App Router (con espejo de docs v15 + guía de cambios v16) para construir aplicaciones frontend con React Server Components, Server Actions, layouts anidados, metadata dinámica, optimización de imágenes y fuentes, Turbopack, y despliegue en producción. Úsala SIEMPRE que trabajes con: App Router (carpeta app/), Server vs Client Components, layouts, loading/error boundaries, Server Actions, fetch con cache, "use cache", next/image, next/font, proxy.ts (ex middleware), route handlers, metadata, generateStaticParams, configuración de next.config.ts, o cualquier feature de Next.js 15/16. También activa para: upgrade de Next 15 a 16, optimización de Core Web Vitals, bundle analysis, code splitting, lazy loading, o integración con TanStack Query en SSR/SSG.

1 other project uses a version of this.

Adopted by

Most recently taken up by

kingsidharth/skillstheir own version, first seen Mar 16, 2026

Other versions1 project uses a version of this.
Word for word · 0
None found.
Edited · 0
None found.
Wrote their own version · 1
kingsidharth/skills★ 17same name
How matches are found. Word for word: the exact same text. Edited: shares passages with this file (“99% same” means 99% of its five-word phrases also appear here; 10% or more counts). Their own version: similar meaning, or, weakest, the same name. We can’t tell which project had it first. Projects are counted among the 200 most-starred candidates, and mentions are links to the repository we found, up to 50 per site, so both counts are a floor.
In this repository31 other files it gives its agents.
- CLAUDE.mdCLAUDE.md
- private-template/CLAUDE.mdCLAUDE.md
- backend-quality-gateSkill
- blindarSkill
- brechasSkill
- crear-appSkill
- desarrollo-por-etapasSkill
- docker-docsSkill
- elegir-metodoSkill
- erp-saas-coreSkill
- fullstackSkill
- graphifySkill
- http-query-docsSkill
- mapa-bloqueSkill
- memory-bank-contextSkill
- mem-searchSkill
- microserviciosSkill
- minio-docsSkill
- nestjs-docsSkill
- nestjs-security-hardeningSkill
- prisma7-docsSkill
- prompt-masterSkill
- react-docsSkill
- redis-docsSkill
- skills-bundleSkill
- tailwind-docsSkill
- tanstack-query-docsSkill
- testing-actionsSkill
- typescript-docsSkill
- ui-ux-polishSkill
- zustand-docsSkill

The file

Create a free account to mount

Files

SKILL.md

Next.js 16 — Referencia Completa (App Router)

LEE PRIMERO references/next16-cambios.md si vas a generar código: Next 16 tiene breaking changes que invalidan patrones de Next 15 (params síncronos, middleware.ts, webpack por defecto).

Reglas no negociables (Next.js 16 + App Router)

params, searchParams, cookies(), headers() son SIEMPRE async — await obligatorio. El acceso síncrono fue ELIMINADO en 16 (en 15 solo estaba deprecado).
Turbopack es el default en next dev y next build — no agregues flags --turbopack. Si el proyecto tiene config custom de webpack, el build FALLA a propósito: migra la config o usa --webpack como escape temporal.
React 19.2 mínimo — Next 16 no arranca con React <19.2.
Server Components por defecto — "use client" solo cuando hay eventos/hooks de estado.
Server Actions para mutaciones — no crear route handlers API solo para forms.
next/image obligatorio para toda imagen; next/font para fuentes.
Metadata: generateMetadata() dinámica, objeto metadata estático.
loading.tsx para Suspense automático, error.tsx para Error Boundaries por segmento.
Caching explícito: "use cache" / Cache Components donde el proyecto lo adopte; fetch con { next: { revalidate: N } } para ISR y { cache: 'no-store' } para dinámico.

Documentación oficial (Context7)

Nunca uses Pages Router (pages/): está prohibido en este stack.

Para la doc oficial y actualizada de Next.js 16, consulta el MCP Context7 (resolve-library-id → query-docs) antes de generar código con APIs que no domines al 100%. Si contradice esta skill en una regla del estándar, gana la skill; si es un detalle de API, gana Context7.

Estructura estándar (App Router)

src/
├── app/
│   ├── layout.tsx          ← Root layout
│   ├── page.tsx            ← Home page
│   ├── (auth)/             ← Route group (sin segmento en URL)
│   │   ├── login/page.tsx
│   │   └── register/page.tsx
│   ├── dashboard/
│   │   ├── layout.tsx      ← Nested layout
│   │   ├── page.tsx
│   │   └── loading.tsx
│   └── api/                ← Route Handlers
│       └── webhooks/
│           └── route.ts
├── components/
│   ├── ui/                 ← Componentes genéricos
│   └── features/           ← Componentes de dominio
└── lib/
    ├── actions/            ← Server Actions
    └── queries/            ← Data fetching functions

Orden de lectura recomendado

Proyecto nuevo: references/next16-cambios.md → routing → data-fetching → rendering → configuring

Upgrade 15 → 16: references/next16-cambios.md completo antes de tocar código

Optimización: optimizing → deploying → architecture (Turbopack)

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

It worked
Partly
It didn't

What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

Check your setup, free