Instalación de Angular CLI y creación de nuestro primer proyecto

Angular es un framework para aplicaciones web, mantenido por Google, de código abierto y que se utiliza para desarrollar aplicaciones web de una sola pagina.

Instalación de Angular CLI y creación de nuestro primer proyecto

Lista de entradas, sobre el tutorial de Angular:

En este nuevo articulo veremos como instalar Angular CLI (Command Line Interface), una utilidad de línea de comandos que nos ayuda a desarrollar y mantener nuestras aplicaciones desarrolladas en Angular.

Requisitos

Para comenzar a usar Angular, es aconsejable que estés familiarizado con las siguientes tecnologías:

  • JavaScript
  • TypeScript
  • HTML
  • CSS

También necesitaremos tener instalado Nodejs y NPM.

Instalación de Angular CLI

La instalación de Angular CLI la realizaremos con NPM con el siguiente comando:

npm install -g @angular/cli

Para comprobar que todo a salido bien podemos comprobar la versión
instalada con el comando:

ng version

Ahora que ya tenemos instalado Angular CLI, estamos preparados para crear y desplegar nuestro primer proyecto web en Angular.

Creación de nuestro primer proyecto en Angular

Para crear un proyecto debemos usar el siguiente comando:

ng new tutorial-angular

El comando ng new, ha creado un directorio con toda la estructura y archivos necesarios para desplegar nuestra aplicación web. Ahora vamos a acceder al directorio de trabajo.

cd tutorial-angular

Desplegamos nuestra aplicación web con:

ng serve

El comando ng serve, compila y despliega nuestra aplicación, si ahora accedemos a http://localhost:4200, podemos ver en marcha nuestra aplicación web.

tutorial-angular-despliegue

El comando ng serve quedara a la espera, para cuando realicemos un cambio en cualquier fichero, compilara y desplegara nuestra aplicación de nuevo. Vamos que no tendremos que ejecutar el comando ng serve cada vez que realizemos un cambio nuestra aplicación web.

Con esto ya tenemos instalado Angular CLI y hemos creado nuestro primer proyecto en Angular.

En el próximo tutorial, crearemos nuestro primer componente, he iremos dando forma a nuestra aplicación web.

Aquí abajo te dejo una serie de enlaces por si quieres ir profundizando en el tema.

Saludos.

Enlaces y referencias:

Angular CLI - Pagina de Angular CLI

NPM - Pagina de NPM

TypeScript - Pagina de TypeScript

Angular Doc - Documentación Angular

💌 Suscribete al blog

Contacta conmigo

Para contactar conmigo, puedes hacerlo accediendo a la pagina de contacto y rellenando el formulario.

También puedes escribirme a traves Twitter.

Roberto Serrano Diaz-Grande

Desarrollador Web FullStack

Este sitio web utiliza cookies para garantizar que obtenga la mejor experiencia en nuestro sitio web Más información