Iniciando con Angular

Prod

Vitmar Aliaga (@cruzjhonson)

Vitmar Aliaga

@cruzjhonson

Systems Engineer / Frontend Developer             

Vitmar Aliaga (@cruzjhonson)

Empecemos

Vitmar Aliaga (@cruzjhonson)

Install

Host Firebase

ng new test-hosting-firebase

Crear proyecto

npm install -g firebase-tools

Instalar tools de firebase

Vitmar Aliaga (@cruzjhonson)

Install

Host Firebase

firebase login

Logearse

Vitmar Aliaga (@cruzjhonson)

Install

Host Firebase

firebase login --reauth

Cambiar Usuario

Vitmar Aliaga (@cruzjhonson)

Install

Ver lista de proyectos asociados

firebase list

Lista de proyectos asociados al usuario

Vitmar Aliaga (@cruzjhonson)

Install

init

Ya podemos inicializar y configurar nuestro proyecto angular, sobre firebase

firebase init
  • yes
  • Hosting

Vitmar Aliaga (@cruzjhonson)

Install

choose project

A continuación nos van a salir la lista de proyectos que tenemos en Firebase.

Tienes que elegir el que queramos asociar a nuestro proyecto angular

Vitmar Aliaga (@cruzjhonson)

Install

choose project

Lo siguiente que nos va a preguntar, es cual es en nuestra aplicación angular, el directorio de publicación. Por defecto, en una aplicación angular el directorio de publicación es "dist". La pregunta tiene el valor "public" por defecto. Nosotros escribimos dist.

Vitmar Aliaga (@cruzjhonson)

Install

choose project

 A continuación nos va a preguntar si queremos crear un fichero index.html. Un proyecto angular ya proporciona este fichero. Por tanto, en esta pregunta simplemente pulsamos enter y ya está.

Vitmar Aliaga (@cruzjhonson)

Install

ok

Y entonces en este punto habremos finalizado el proceso de creación del fichero de configuración para Firebase, que se llama firebase.json

Vitmar Aliaga (@cruzjhonson)

Install

prod

ng build --prod

Compilar el codigo

https://angular.io/guide/aot-compiler

Vitmar Aliaga (@cruzjhonson)

Install

desplegar

firebase deploy

Desplegar la app

Es todo!

Github: http://github.com/valiaga

Slides : http://slides.com/vitmaraliaga

Empezando con Angular 5 - Production

By Vitmar Aliaga

Empezando con Angular 5 - Production

Introducción a Angular

  • 42