Crear un proyecto Angular 20 desde cero

Resumen

Iniciar un proyecto Angular 20 desde la terminal es el primer paso para construir aplicaciones modernas con Firebase. Aquí aprendes a verificar tus dependencias, instalar el CLI de Angular globalmente y configurar un proyecto listo para integrar un chat en tiempo real, ideal si vienes del mundo del desarrollo front end y quieres trabajar con la última versión del framework de Google.

¿Cómo verificar que Node, npm y Git están instalados correctamente?

Antes de crear cualquier proyecto, necesitas confirmar que las herramientas base funcionan. Abre una terminal de PowerShell directamente en tu escritorio: mantén presionado shift, clic derecho y selecciona Open PowerShell Window Here. Ese detalle te ahorra navegar entre carpetas después [0:30].

Desde la terminal ejecuta tres comandos para validar tu entorno:

  • node -v para confirmar la versión de Node.js.
  • npm -v para chequear el manejador de paquetes.
  • git --version para validar Git.

Si alguno arroja error, revisa dos cosas. Primero, que al instalar hayas marcado el checkbox que agrega el path automáticamente. Segundo, ve a Inicio, escribe variables de entorno y verifica que las tres herramientas aparezcan listadas en el path del sistema [1:05].

¿Qué es npm? Es Node Package Manager, el gestor oficial de paquetes de Node.js. Te permite instalar librerías y herramientas como el CLI de Angular con un solo comando.

¿Cómo instalar el Angular CLI de forma global?

Con las dependencias en orden, instala el CLI de Angular ejecutando npm install -g @angular/cli. La bandera -g indica instalación global, lo que significa que podrás usar Angular desde cualquier carpeta de tu computadora, no solo dentro de un proyecto específico [1:50].

El Angular CLI es la herramienta que te permite crear, servir y compilar proyectos Angular directamente desde la terminal. Sin él, tendrías que configurar manualmente todo el andamiaje del framework.

Una vez termine la instalación, valida con ng -v. Si todo salió bien, verás en pantalla la versión instalada. En este caso, Angular 20.2 corriendo sobre Node 22.19 [2:20].

¿Para qué sirve el comando ng? Es el ejecutable del Angular CLI. Lo usas para crear proyectos, generar componentes, levantar el servidor de desarrollo y construir tu aplicación para producción.

¿Cómo iniciar un proyecto Angular nuevo con ng new?

Para crear el proyecto ejecuta ng new angular20-firebasechat. Ese nombre te servirá como referencia clara: estás trabajando con Angular 20 y vas a integrar un chat con Firebase [2:45].

El CLI te hará varias preguntas durante la creación. Estas son las decisiones que tomas en este flujo:

  1. Estilos: elige CSS como hoja de estilos por defecto.
  2. Server Side Rendering: responde no, porque trabajarás con renderizado del lado del cliente.
  3. Zoneless: déjalo en su comportamiento original respondiendo no.
  4. Optimización para IA: responde no, ya que vas a configurar el proyecto manualmente paso a paso.

Mientras esperas, el CLI descarga e instala todos los paquetes necesarios. Esto puede tardar un par de minutos dependiendo de tu conexión.

¿Qué hago después de que termine la instalación?

Cuando el proceso finalice, abre Visual Studio Code y carga la carpeta del proyecto. Ve a File, luego Open Folder y selecciona angular20-firebasechat desde tu escritorio [3:40].

A partir de aquí ya tienes el esqueleto completo del framework listo para que empieces a conectar Firebase y construir tu chat en tiempo real. Cuéntame en los comentarios qué versión de Node estás usando y si tuviste algún problema con las variables de entorno.