DEV Community

Sandy Marmolejo
Sandy Marmolejo

Posted on • Edited on

Instalación de Angular 10

Hola a todos

En este post te explicaré como instalar Angular 10 en tu aplicación y los pasos previos para el entorno. Esta publicación requiere conocimientos de HTML y JavaScript.

Pasos previos

Instalar Node y Npm

Angular requiere Node.js. Así que para poder empezar deberás tener instalado Node.js

Puedes comprobar si lo tienes instalado desde el terminal.

node --version

Alt Text

En caso de no tenerlo instalado puedes descargarlo desde su web oficial Node.js en https://nodejs.org/es/download/

Instalar Angular CLI

Ahora vamos a instalar el CLI de Angular, el cual nos va a ayudar a crear un proyecto de angular desde cero. La instalación será de manera global para que esté disponible en todos los proyectos de tu computadora. Se recomienda ejecutar este comando como administrador. En la terminal, escribe el siguiente comando:

npm install -g @angular/cli

Alt Text

Creando tu primera APP en Angular

Estamos listos para empezar a trabajar con Angular, en este caso utilizaremos la versión 10.

En la terminal, ve al directorio donde quisieras colocar tu proyecto y ponle un nombre a tu app. Para crear el proyecto, ejecutemos el siguiente comando:

ng new nombreDeTuApp

Alt Text

En la consola saldrán varias preguntas, la primera es si queremos tener routing, es decir añadir rutas a tu aplicación de Angular. El routing sirve para tener algo así como distintas pantallas en nuestra aplicación a las cuales podemos navegar y se muestren presentando la pantalla correcta en cada momento. Para este ejemplo responderemos No con N del (Y/N) y presionamos enter.

Alt Text

La otra opción es qué tipo de estilos utilizar. En Angular, podemos utilizar CSS, Scss, Sass, Less y Stylus.

Para nuestro ejemplo, elegimos Sass utilizando las flechas de desplazamiento.

Ya con esto se va a empezar a crear el proyecto, es normal que demore unos minutos por la instalación de las dependencias.

Ahora tenemos creado una carpeta con el nombre de nuestro proyecto.

Vamos a nuestra carpeta y encontrarás en el boilerplate varias carpetas y ficheros.

Alt Text

Para arrancar nuestra aplicación de Angular 10 en el servidor.
Ejecutamos en la consola el comando

ng serve

Te aparecerá un localhost:4200 (a tí te puede salir otro puerto 😊) al cual deberás de darle ctrl + click.

Alt Text

Este comando sirve para compilar y levantar en nuestro servidor local, de este modo podemos acceder a ella desde un navegador web y tendremos nuestra primera aplicación en Angular 10.

Alt Text

Esto es el primer paso para crear tu primera app en Angular, no te pierdas los próximos posts donde iremos profundizando en esto. Hasta la próxima 😏

Top comments (0)