guibean/site-estatico

Sitio Estático Next.js

Cuándo usar

Úsalo para landing page, sitio institucional, página de campaña, portafolio o blog. El resultado es solo front-end, exportado como HTML/CSS/JS y publicado en Cloudflare Pages.

No lo uses cuando haya inicio de sesión, registro, base de datos, panel administrativo, facturación, carga de archivos o API propia. En esos casos usa la skill sistema-fullstack.

Crear un proyecto

1. Confirma nombre, dominio final, objetivo de la página y si existe formulario de contacto.
2. Usa el repositorio de sitio estático:

git clone https://github.com/guibean/nextjs-template.git <slug>
cd <slug>
git remote remove origin
git remote add origin https://github.com/guibean/<slug>.git

3. Crea .env.local a partir de .env.example y completa NEXT_PUBLIC_SITE_URL, nombre, autor y correo electrónico.
4. Ejecuta pnpm install, pnpm lint, pnpm typecheck y pnpm build.
5. Solo entonces modifica el contenido.

Reglas

• No agregues dependencias de backend.
• Instala componentes shadcn bajo demanda:

pnpm exec shadcn add dialog
pnpm exec shadcn add @aceternity/spotlight

• Para bloques de Aceternity, verifica la licencia e instala motion solo si el componente lo requiere.
• Mantén un único h1 por página y la jerarquía de encabezados.
• Cada página nueva necesita createMetadata, entrada en el sitemap y enlace navegable.
• Usa next/image con sizes e imágenes procesadas con pnpm images.
• No uses output: "server", Server Actions ni API Routes de Next en este perfil.
• Formulario: conserva Turnstile + functions/api/contact.ts + Resend.

Lista de verificación antes de entregar

Lee references/seo-checklist.md y confirma:

• metadata, canonical, Open Graph y robots
• sitemap incluye todas las páginas públicas
• llms.txt actualizado
• imágenes en assets/images/ y public/images/ generadas
• un h1, contraste, foco visible y navegación por teclado
• enlaces externos con rel apropiado
• pnpm lint, pnpm typecheck, pnpm build pasando
• Lighthouse ≥ 95 en las cuatro categorías
• privacidad actualizada si hay formulario/analytics

Despliegue en Cloudflare Pages

• Comando de build: pnpm build
• Directorio de salida: out
• Node: 24
• Variables públicas en build y secretos en Functions
• Configura el dominio en NEXT_PUBLIC_SITE_URL, TURNSTILE_HOSTNAME y CONTACT_ALLOWED_ORIGIN