Configuración del proyecto y CLI
Aprenda a inicializar un proyecto nuevo de Next.js 15 y a recorrer su estructura básica mediante la interfaz de línea de comandos.
Configuración del proyecto y CLI es una lección gratuita de Next.js 15 Fullstack (App Router + Server Actions) en CoddyKit. Esta es la lección 1 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Next.js 15 Fullstack (App Router + Server Actions), y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Next.js 15 Fullstack (App Router + Server Actions) incluye 4 lecciones en total.
Next.js 15: Tu Primer Paso
Bienvenido a Next.js 15 — el framework de React para crear aplicaciones rápidas, escalables y listas para producción. Para empezar: crearemos un proyecto y entenderemos su estructura desde la CLI.
Lo que Necesitarás
Antes de empezar, necesitarás Node.js 18.17 o posterior — este proporciona el runtime de JavaScript, y su gestor de paquetes (npm, Yarn o pnpm) instala tus dependencias.
Inicializando tu Proyecto
Crea un nuevo proyecto con create-next-app — te genera toda la estructura. Solo tienes que ejecutar esto en tu terminal.
npx create-next-app@latestPrompts de Configuración Explicados
La CLI hace algunas preguntas. La que importa: di Sí a App Router — es esencial para Next.js 15. ESLint y Tailwind son útiles; TypeScript es opcional.
Navegando tu Nuevo Proyecto
Cuando finalice, tendrás una nueva carpeta del proyecto. Accede a ella con cd y estarás listo para trabajar.
cd my-next-appEstructura de tu Proyecto
Conoce los archivos clave generados: app/ contiene tus páginas y layouts, public/ los assets estáticos, package.json tus dependencias y scripts, y next.config.js la configuración.
El Directorio Principal `app`
El directorio app/ impulsa el App Router: layout.js para la UI compartida, page.js para la vista única de una ruta, y globals.css para los estilos globales.
Scripts del Proyecto y `npm run dev`
Tus scripts se encuentran en `package.json`. El que más utilizarás es **npm run dev** — inicia el servidor de desarrollo.
npm run dev¡Hola Next.js!
Con el servidor de desarrollo en ejecución, abre localhost:3000 para ver tu aplicación. Esa página es renderizada por app/page.js — aquí tienes una versión simplificada.
export default function Home() {
return (
<main>
<h1>Hello CoddyKit!</h1>
</main>
);
}Repaso Rápido: Configuración Básica
Has aprendido a iniciar un proyecto de Next.js. ¡Pongamos a prueba tus conocimientos!
Recapitulación: Tus Primeros Pasos con Next.js
Resumen: configuraste Next.js 15 con create-next-app, exploraste el directorio app/ y lanzaste el servidor de desarrollo. Siguiente: enrutamiento del sistema de archivos.
Preguntas frecuentes
¿La lección «Configuración del proyecto y CLI» es gratis?
Sí — el texto completo de «Configuración del proyecto y CLI» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Next.js 15 Fullstack (App Router + Server Actions), actualiza a CoddyKit PRO. El curso de Next.js 15 Fullstack (App Router + Server Actions) incluye 4 lecciones en total.
¿Qué aprenderé en «Configuración del proyecto y CLI»?
Aprenda a inicializar un proyecto nuevo de Next.js 15 y a recorrer su estructura básica mediante la interfaz de línea de comandos. Practicas Next.js 15 Fullstack (App Router + Server Actions) con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Next.js 15 Fullstack (App Router + Server Actions)?
No se requiere experiencia previa. Next.js 15 Fullstack (App Router + Server Actions) en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 1 de 4.
¿Cuánto tiempo toma la lección «Configuración del proyecto y CLI»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Next.js 15 Fullstack (App Router + Server Actions)?
Sí. Cada lección de Next.js 15 Fullstack (App Router + Server Actions) incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Configuración del proyecto y CLI
- Fundamentos del enrutamiento basado en el sistema de archivos
- Introducción a páginas y layouts
- Aplicación de estilos a su app de Next.js