Cómo Crear una Landing Page con Nuxt: Guía Paso a Paso

Aprende a construir una landing page de alta conversión con Nuxt, Nuxt UI v4 y componentes pre-construidos de LandiNuxt.

Última actualización: June 2026

1

Crear proyecto Nuxt

Inicia un proyecto Nuxt con el CLI oficial: npx nuxi@latest init mi-landing-page

2

Instalar Nuxt UI v4

Instala @nuxt/ui y añádelo al array modules en nuxt.config.ts. Incluye Tailwind CSS automáticamente.

3

Añadir componentes LandiNuxt

Copia secciones Hero, Features y CTA desde /components y pégalas en tu proyecto. Cada componente es autocontenido.

4

Configurar SSR/ISR

Usa routeRules con prerender para páginas estáticas o isr para contenido que se actualiza periódicamente. Mejora Core Web Vitals y SEO.

5

Implementar metadata SEO

Añade title, description y Open Graph con useSeoMeta. Usa @nuxtjs/seo para sitemap y robots.txt automáticos.

6

Medir con Lighthouse

Objetivo: LCP < 2.5s, INP < 200ms, CLS < 0.1. Usa Nuxt Image y lazy loading para optimizar.