Comprensión de la estructura del proyecto

Anatomía del proyecto

Mapeemos los archivos generados por el instalador. Comprender este esquema es esencial para saber dónde ubicar su lógica y sus estilos.

El árbol de directorios

headless-wp/
├── app/              # Enrutamiento y lógica de la aplicación
├── public/           # Activos estáticos (imágenes, fuentes)
├── package.json      # Dependencias y scripts
├── next.config.js    # Configuración personalizada de Next.js
└── tsconfig.json     # Configuración de TypeScript

Análisis detallado de carpetas

📁 /app (El Núcleo)

Aquí es donde ocurre la magia. Next.js utiliza un sistema de enrutamiento basado en el sistema de archivos en esta carpeta.

• page.tsx: Se asigna a la URL raíz (/).
• layout.tsx: Una interfaz de usuario compartida que envuelve sus páginas.