Hasta ahora has trabajado con ficheros que escribes tú. En los proyectos reales se usan también herramientas y librerías de otras personas: un framework de CSS, un servidor de pruebas, un optimizador de imágenes. Se instalan y se usan desde la terminal con npm. Aquí aprenderás lo justo para no tenerle miedo; lo usarás enseguida con Tailwind (lección Tailwind CSS).

La terminal es una ventana donde das órdenes al ordenador escribiendo en lugar de hacer clic. En VS Code ábrela con Terminal → Nueva terminal (o Ctrl + ñ en teclado español). Se abre ya en la carpeta de tu proyecto.

Trucos: la tecla Tab completa nombres de carpetas y ficheros; la flecha ↑ recupera las órdenes anteriores; Ctrl + C detiene lo que se esté ejecutando.

• Node.js permite ejecutar JavaScript fuera del navegador. Muchas herramientas web están hechas con él.
• npm (Node Package Manager) viene con Node.js: descarga e instala paquetes (librerías y herramientas) desde el registro público npmjs.com.

Instala la versión LTS (la estable) desde nodejs.org y comprueba en la terminal que todo está bien:

En la carpeta del proyecto, escribe:

npm init -y

Crea un fichero package.json: la ficha del proyecto. Guarda su nombre, sus dependencias (qué paquetes usa) y sus scripts (atajos para ejecutar tareas).

{
  "name": "mi-portfolio",
  "version": "1.0.0",
  "scripts": {
    "dev": "serve ."
  },
  "devDependencies": {
    "serve": "^14.2.6"
  }
}

npm install -D serve     # -D: herramienta de desarrollo (devDependencies)
npm install algo         # sin -D: la web la necesita para funcionar (dependencies)

Al instalar aparecen dos cosas:

• La carpeta node_modules/, con el código de los paquetes. Puede pesar mucho y no se sube a Git: créate un fichero .gitignore con una línea node_modules/.
• El fichero package-lock.json, que apunta las versiones exactas instaladas. Sí se sube a Git.

Si descargas un proyecto que tiene package.json (de un compañero, de GitHub), basta con escribir npm install para que npm instale todo lo que necesita.

Los scripts de package.json se ejecutan con npm run nombre:

npm run dev    # ejecuta "serve ." → sirve tu web en http://localhost:3000

Los proyectos modernos casi siempre tienen npm run dev (desarrollo) y npm run build (generar la versión para publicar).

Y npx ejecuta un paquete sin instalarlo, para usos puntuales:

npx serve .

⚠️ Atención. Instalar un paquete es ejecutar código de otra persona en tu ordenador. Instala solo paquetes conocidos (mira en npmjs.com las descargas semanales y cuándo se actualizó), copia el nombre exacto (hay paquetes falsos con nombres casi iguales) y ejecuta de vez en cuando npm audit para ver si alguno tiene fallos de seguridad conocidos.

1. Instala Node.js LTS y comprueba node -v y npm -v.
2. Crea una carpeta prueba-npm con un index.html sencillo y ábrela en VS Code.
3. En la terminal: npm init -y y npm install -D serve.
4. Añade en package.json el script "dev": "serve ." y ejecuta npm run dev. Abre la dirección que aparece.
5. Crea .gitignore con node_modules/ y comprueba en GitHub Desktop que esa carpeta ya no aparece para subir.

• Ejecutar npm en la carpeta equivocada: "Could not read package.json". Mira dónde estás con pwd y entra con cd.
• Subir node_modules/ a GitHub: miles de ficheros. Usa .gitignore.
• Borrar package.json o package-lock.json: sin ellos no se sabe qué instalar.
• Instalar con sudo o de forma global (-g) sin necesidad: instala en el proyecto.
• Cerrar la terminal con npm run dev en marcha y no entender por qué la web ya no carga: el servidor se detiene con la terminal.