Frameworks

Antes de explicar cómo instalar Angular 8, queremos recordarte que, si te interesa aprender a utilizar este framework, tienes una buena oportunidad de hacerlo de forma gratuita, ya que puedes probar nuestra plataforma durante 15 días sin coste alguno. De esta forma tendrás acceso a un gran catálogo de cursos y talleres, entre ellos el curso de Angular 8 para principiantes, ideal para aprender sin tener conocimientos previos.

Y ahora comenzamos con este interesante artículo sobre la instalación y requisitos previos de Angular 8.

Pasos previos

Antes de poder realizar la instalación de Angular 8, necesitamos instalar previamente:

• Un IDE para poder editar el código. En este caso vamos a utilizar Visual Studio Code, pero se puede utilizar cualquier otro.
• Git, para poder almacenar nuestro código.
• Node y npm, para poder instalar Angular.
• CLI Angular 8, que será lo último que instalaremos.

Instalación de Visual Studio Code

La descarga de Visual Studio Code podemos realizar desde la web code.visualstudio.com y pulsando en el botón de descargar.

Una vez descargado, lo instalamos como cualquier otro programa de Windows.

Instalación de Git

A continuación, debemos instalar Git, para lo que realizamos la descarga desde git-scm.com/downloads.

De la misma forma que hicimos antes, elegimos nuestro sistema operativo, descargamos el instalador y lo ejecutamos.

La instalación la realizaremos sin modificar casi ninguna opción de las que están marcadas por defecto.

El primer paso es aceptar las condiciones de la licencia. Después elegimos el directorio de instalación y seleccionamos los componentes marcados por defecto para instalar, verificando que esté marcada la opción “Git Bash here”.

A continuación, seguimos avanzando en las siguientes pantallas pulsando en Next para aceptar las opciones por defecto, hasta que comience la instalación de Git.

Mientras se instala, vamos a crear una carpeta en la que se empezará a construir el proyecto, que este caso la hemos llamado “Practica”.

Una vez finalizada la instalación de Git, pulsamos con el botón derecho del ratón sobre la carpeta anterior, y nos aparecen dos nuevas opciones para abrirla.

Elegimos la opción “Git Bash Here” y comprobamos que se abre la consola y reconoce los comandos de Git, por lo que está correctamente instalado.

Instalación de Node

Para descargar Node accedemos a nodejs.org/es, dónde nos aparecen dos opciones para descargar. En este caso elegiremos la opción de la izquierda, que es la opción estable y la más recomendada para la mayoría.

Cuando finalice la descarga, ejecutamos el instalador y seguimos el proceso de instalación con las opciones marcadas por defecto, como hicimos en el caso anterior.

Concluida la instalación de Node, abrimos la carpeta del proyecto con la opción “Open with Code”.

De esta forma cargamos la carpeta en Visual Studio Code, y en la zona izquierda clicamos con el botón derecho y abrimos el terminal.

Una vez se ha abierto la terminal, comprobamos si Node se ha instalado correctamente, para ello ejecutamos el comando node -v y nos debe aparecer la versión que se ha instalado, lo que confirma que la instalación ha sido correcta, ya que de lo contrario se nos mostraría un mensaje de error.

Instalación de Angular

Para instalar Angular vamos a utilizar el mismo terminal que hemos utilizado previamente, en el que ejecutaremos el comando npm install -g @angular/cli.

De esta forma instalaremos Angular de forma global, independientemente de la carpeta en la que nos encontremos, y, también se instalará la última versión estable que exista.

Tras esperar que termine el proceso de instalación, de nuevo verificamos que la misma ha sido correcta, con el comando ng v, que nos devolverá la información de la versión instalada.

Comenzando un proyecto con Angular 8

Ya tenemos instalado todo lo necesario para comenzar nuestro primer proyecto con Angular 8, así que para crearlo utilizaremos la carpeta que previamente habíamos creado, y lo generamos ejecutando el comando ng new nombre-proyecto en el terminal, con el nombre que queramos utilizar, que en nuestro caso será “angular8”.

Durante el proceso de instalación, el asistente del CLI de Angular irá realizando una serie de preguntas para ofrecernos varias opciones. Lo primero que nos preguntará será si queremos autogenerar las rutas, a lo que responderemos afirmativamente. Después nos preguntará qué opción queremos elegir para el CSS, y aquí seleccionaremos SCSS.

Seguidamente comienza el proceso de creación de nuestro proyecto, que llevará unos minutos hasta que se complete. Una vez finalizado lo lanzamos ejecutando en la consola el comando ng serve -o, pero lo haremos siempre desde la carpeta de nuestro proyecto, por lo que previamente accedemos a ella con el comando cd angular8.

Tras esperar unos segundos ya tendríamos el proyecto ejecutándose, y se abre el navegador automáticamente con el puerto correspondiente, ya que habíamos utilizado la opción -o en la ejecución.

De esta forma ya podríamos comenzar a trabajar con el proyecto editando todo lo que necesitemos.