Receta · Archivo .cursorrules · IA para programación
Reglas de Cursor para Next.js, TypeScript y Tailwind
Una regla de proyecto de Cursor (un archivo .mdc dentro de .cursor/rules/) le da al editor el contexto de tu proyecto Next.js con App Router, TypeScript y Tailwind, para que sus sugerencias sigan tus convenciones en vez de proponer patrones genéricos. No ejecuta nada ni toca tu código: es un fichero de instrucciones que Cursor lee al generar o refactorizar, con alcance por globs. Esta versión está adaptada de una plantilla pública con licencia CC0 y reescrita al formato de reglas vigente (.mdc), con notas de revisión en español.
- Intermedio
- 15 min de montaje
- Última revisión: 2026-06-06
- Plantilla pública revisada
Esta receta está adaptada desde una fuente pública verificable. Hemos revisado la estructura, eliminado secretos y documentado los cambios, pero debes probarla en tu instancia antes de usarla en producción.
Stack de la receta
Transparencia: Qoniar puede recibir una comisión cuando contratas una herramienta a través de los enlaces de esta página. No supone un coste adicional para ti y no influye en nuestro criterio editorial: testeamos cada herramienta hands-on antes de recomendarla. Consulta la divulgación de afiliados.
nextjs.mdc
cursorrules · markdown
---
description: Convenciones de Next.js (App Router) + TypeScript + Tailwind para este proyecto
globs: **/*.ts, **/*.tsx
alwaysApply: false
---
# Cursor Project Rule: Next.js (App Router) + TypeScript + Tailwind
# Adapted by Qoniar from a public CC0 template. Review and trim to your project.
You are assisting on a Next.js project that uses the App Router, TypeScript in
strict mode and Tailwind CSS. Follow these conventions unless the user says
otherwise.
## Architecture
- Default to Server Components. Add "use client" only when the file needs state,
effects, browser APIs or event handlers.
- Keep data fetching in Server Components or server actions; do not fetch from a
client component when a server one will do.
- Use the App Router file conventions: app/, layout.tsx, page.tsx, loading.tsx,
error.tsx, route.ts. Co-locate components under the route that owns them.
## TypeScript
- Assume "strict": true. No implicit any; do not add non-null assertions to
silence the compiler; fix the type instead.
- Prefer explicit return types on exported functions. Model data with types or
interfaces close to where they are used.
- Use string literal unions instead of enums for simple sets of values.
## Styling (Tailwind)
- Style with Tailwind utility classes in the markup. Extract a component before
duplicating a long class list a third time.
- Keep design tokens in the Tailwind config; avoid arbitrary values when a token
already exists.
## SEO & metadata
- Export the Metadata object (or generateMetadata) from each route segment that
needs a title and description. Do not ship a page without a title.
- Use next/image for raster images and set width/height (or fill) to avoid
layout shift.
## Conventions
- Name files in kebab-case; name React components in PascalCase.
- Read configuration from environment variables; never hardcode secrets or keys.
- When a rule here conflicts with the project's own docs or the user's request,
the project and the user win.
Para ejecutar esta receta
Necesitas Cursor
Editor con IA que escala refactoring largo en proyectos reales
Respuesta directa
Esta receta parte de una plantilla pública de reglas para Cursor con licencia CC0 y la adapta a proyectos Next.js con App Router, TypeScript y Tailwind. El resultado es un archivo .mdc que colocas en .cursor/rules/, el formato de reglas que Cursor usa hoy (el antiguo .cursorrules de la raíz queda como alternativa heredada). Lleva frontmatter con description, globs y alwaysApply, así que acotas a qué archivos aplica. Cursor lo lee y ajusta sus sugerencias a tus convenciones: Server Components por defecto, tipado estricto, utilidades de Tailwind y metadata para SEO. No es código que se ejecute ni un comando que cambie archivos solo; son instrucciones que el editor consulta al generar o refactorizar. El montaje ronda los quince minutos: creas el archivo, pegas la regla y la recortas a tu versión de Next y a tu equipo antes de confiar en ella.
Lo que importa
- La regla vive en .cursor/rules/*.mdc (formato vigente); el .cursorrules de la raíz queda como alternativa heredada
- Es contexto para Cursor, no código que se ejecute ni un comando que toque tu repo
- Adaptada de una plantilla pública CC0 y reescrita al formato .mdc, no una copia directa
- El frontmatter (globs) acota a qué archivos aplica; recórtala a tu versión de Next y a tu equipo
Qué necesitas
- Tener Cursor instalado (cualquier plan, incluido el gratuito)
- Un proyecto Next.js con App Router, TypeScript y Tailwind, nuevo o existente
- Acceso a la raíz del repositorio para añadir la carpeta .cursor/rules/
Montaje paso a paso
4 pasos para dejar la receta funcionando.
Crear la regla en .cursor/rules/
En la raíz de tu proyecto Next.js crea la carpeta .cursor/rules/ y, dentro, un archivo nextjs.mdc. Es el formato de reglas de proyecto que Cursor usa hoy; lo detecta solo al abrir el repositorio, sin activar nada en ningún menú.
Pegar la regla adaptada
Copia el contenido de esta página dentro del .mdc. Empieza por el frontmatter (description, globs, alwaysApply) y sigue con las reglas: convenciones de App Router, tipado de TypeScript, uso de Tailwind y metadata para SEO. Guarda y reinicia el chat de Cursor si lo tenías abierto.
Ajustar el alcance y recortar
Revisa el frontmatter: con globs decides a qué archivos aplica (por ejemplo **/*.tsx) y con alwaysApply si se carga en cada sesión. Quita o cambia las reglas que no encajen con tu versión de Next ni con las normas de tu equipo antes de darlas por buenas.
Comprobar que Cursor la aplica
Abre el chat de Cursor y pídele una tarea pequeña, por ejemplo un Server Component con metadata. Si la respuesta respeta las convenciones del archivo, la regla está activa; si no, confirma que está en .cursor/rules/ y que el glob cubre el archivo que editas.
Preguntas frecuentes
¿Esto ejecuta o cambia mi código por su cuenta?
No. Una regla .mdc es texto que Cursor lee como contexto cuando generas o editas; no corre comandos ni modifica archivos por sí misma. Los cambios los sigues aplicando tú desde el editor, con la revisión de siempre.¿Qué pasó con el archivo .cursorrules de la raíz?
Es el formato heredado: aún funciona, pero la documentación actual de Cursor coloca las reglas en .cursor/rules/ como archivos .mdc, con frontmatter y alcance por globs. Esta receta usa el formato vigente; si mantienes un .cursorrules antiguo, conviene migrarlo.¿Vale para Pages Router o solo para App Router?
Está pensado para App Router, con Server Components por defecto y la estructura de la carpeta app. Con Pages Router parte de las reglas no aplican: tendrías que quitar las referencias a layouts y a la convención de archivos del App Router.¿Funciona con el plan gratuito de Cursor?
Sí. Las reglas de proyecto son una función del editor, no del plan, así que se leen igual en la versión gratuita y en la de pago. Lo que cambia entre planes es el acceso a modelos, no cómo se aplican estas reglas.¿La uso tal cual o tengo que adaptarla?
Conviene adaptarla. Viene de una plantilla pública pensada para un proyecto genérico; revisa cada regla y ajusta el frontmatter y el contenido a tu versión de Next, a tu estilo de Tailwind y a las normas de tu equipo antes de confiar en ella.
Fuente original verificada
Plantilla pública revisada y adaptada
- Fuente
- awesome-cursorrules
PatrickJS y contribuidores · GitHub
- Revisión de la fuente
- 2026-06-06
Licencia declarada: CC0-1.0
Adaptación por Qoniar
Regla reescrita y reorganizada desde la fuente pública CC0 citada, manteniendo el formato .mdc de reglas de proyecto vigente en Cursor: añadido frontmatter propio (description, globs para *.ts/*.tsx, alwaysApply), reglas agrupadas por bloques (App Router, TypeScript estricto, Tailwind, SEO/metadata y convenciones), copy adaptado a español con avisos de revisión añadidos, incorporada una regla de precedencia del proyecto y del usuario, y eliminado lo redundante; sin credenciales ni secretos.