En esta entrada vamos a aprender los fundamentos básicos para crear nuestra primera aplicación en Angular 4.
Ya que en el post anterior vimos las novedades Angular 4 que presenta esta nueva versión sobre su antecesora Angular 2, ahora vamos a hacer lo que en otros frameworks es el típico «Hola mundo» pero con arquitectura Angular JS.
Índice
Preparativos.
- Instalamos NodeJS desde https://nodejs.org/.
- Abrimos línea de comandos con permisos de administrador e instalamos Angular-CLI
npm install -g angular-cli
- Ahora creamos nuestro proyecto en el directorio que deseemos. Yo lo voy a llamar MyProject.
ng new <Nombre del proyecto>
- Accedemos dentro del directorio del proyecto y comprobamos la versión de Angular JS.
ng -v
- Como podéis apreciar, hemos instalado por defecto la versión 2 de Angular JS. Pero como nosotros queremos trabajar con la última versión de Angular vamos a actualizar las dependencias. Para ello volvemos a la línea de comandos y tecleamos lo siguiente.
npm install @angular/common@latest @angular/compiler@latest @angular/compiler-cli@latest @angular/core@latest @angular/forms@latest @angular/http@latest @angular/platform-browser@latest @angular/platform-browser-dynamic@latest @angular/platform-server@latest @angular/router@latest @angular/animations@latest typescript@latest --save
- Volvemos a comprobar la versión de Angular y es ahora cuando vemos que ya disponemos de Angular 4.
- Lanzamos la aplicación, al colocar el comando –o al final lo que conseguimos es que cuando termine de compilar se abra directamente en el navegador bajo el puerto 4200.
ng serve --o
Resultado de Mi primera aplicación en Angular 4.
Podemos ver vía navegador el resultado de nuestra primera aplicación en Angular 4.
En la próxima entrada del blog veremos como hacer una aplicación algo más compleja metiendo mano al código.
Ah y recuerda!!!, si quieres estar al día acerca de la creación de nuevas entradas, no te olvides de suscribirte al blog.
[wysija_form id=»1″]
Versiones utilizadas, tiempo y dificultad de desarrollo:
Dificultad del ejercicio: Iniciación.
Tiempo de realización: 10 minutos.
Angular Framework version: 4.1.3
Node versión: 7.5.0
NPM versión: 4.6.1
Sistema operativo: Windows 7