Angular

Angular

Tutorial Angular: Instalación Angular

Angular instalación y configuración entorno. Sigue una guía paso a paso para instalar y configurar Angular en tu entorno de desarrollo con ejemplos detallados.

Aprende Angular y certifícate

Angular es un framework de desarrollo de aplicaciones web desarrollado por Google. Ofrece una arquitectura robusta y un conjunto completo de herramientas para construir aplicaciones web de una sola página (SPA, por sus siglas en inglés).

Para comenzar a trabajar con Angular, es necesario realizar algunos pasos de instalación y configuración previos.

Requisitos previos

Instalación de Node.js y npm

Angular requiere Node.js y npm (Node Package Manager) para funcionar. 

Si no tienes Node.js instalado en tu sistema, sigue estos pasos:

  1. Descargar Node.js: Ve al sitio oficial de Node.js y descarga la versión LTS (Long Term Support) recomendada.
  2. Instalar Node.js: Ejecuta el instalador descargado y sigue las instrucciones en pantalla. Asegúrate de seleccionar la opción que añade Node.js al PATH de tu sistema.
  3. Verificar la instalación:
    • Abre la terminal (símbolo del sistema o PowerShell).
    • Ejecuta node -v y npm -v para verificar que ambas herramientas se hayan instalado correctamente. Deberías ver la versión instalada de Node.js y npm respectivamente.

Actualización de npm

A veces, la versión de npm instalada por defecto puede no ser la más reciente. Para asegurarte de tener la última versión de npm, ejecuta el siguiente comando en la terminal:

npm install -g npm

Instalación de Angular CLI

La Angular CLI (Command Line Interface) es una herramienta que facilita la creación y manejo de proyectos Angular

Para instalar la Angular CLI globalmente en tu sistema, utiliza el siguiente comando en la terminal:

npm install -g @angular/cli

Para verificar que la instalación fue exitosa, puedes ejecutar:

ng version

Deberías ver información sobre la versión de Angular CLI instalada.

Creación de un nuevo proyecto Angular

Una vez que Angular CLI está instalada, puedes crear un nuevo proyecto Angular fácilmente. 

Sigue estos pasos:

  1. Abrir la terminal: Abre el símbolo del sistema o PowerShell.
  2. Navegar a la carpeta de trabajo: Usa el comando cd para cambiar a la carpeta donde deseas crear tu proyecto.
  3. Crear el proyecto: Ejecuta el siguiente comando reemplazando nombre-proyecto con el nombre que desees para tu proyecto:
ng new nombre-proyecto

Seguir las indicaciones: La CLI te hará algunas preguntas sobre la configuración del proyecto. Puedes aceptar las opciones predeterminadas o personalizarlas según tus necesidades.

Navegar al directorio del proyecto:

cd nombre-proyecto

Servir la aplicación

Después de crear tu proyecto Angular, puedes servir la aplicación para verla en tu navegador. 

Esto se hace con el siguiente comando:

ng serve

Por defecto, Angular servirá tu aplicación en http://localhost:4200/. Abre tu navegador y visita esta URL para ver tu aplicación Angular en funcionamiento.

Aprende Angular online

Otras lecciones de Angular

Accede a todas las lecciones de Angular y aprende con ejemplos prácticos de código y ejercicios de programación con IDE web sin instalar nada.

Accede GRATIS a Angular y certifícate

Ejercicios de programación de Angular

Evalúa tus conocimientos de esta lección Instalación Angular con nuestros retos de programación de tipo Test, Puzzle, Código y Proyecto con VSCode, guiados por IA.