Academia.eduAcademia.edu

Libro angular 2 (1)

Libro Angular 2 Tabla de contenido Introducción 0 ¿Por qué Angular 2? 1 Prerequisitos 2 Enviorement 3 Dependencias 4 Arquitectura 5 TypeScript 6 Components 7 Lifecycle 7.1 Styles 7.2 Templates 8 Data Binding 9 Directives 10 Pipes 11 Routing 12 Resolve 12.1 ui-router 12.2 Http 13 Services 14 Firebase RxJS Observables 14.1 15 15.1 Forms 16 Tests 17 TDD 17.1 BDD 17.2 2 Libro Angular 2 Angular 2 Este libro se basa en la recopilación de información adquirida de diferentes fuentes (libros, tutoriales, experiencia personal) sobre Angualar 2. Es más un libro personal que con intención de difusión, pero si en el futuro le sirve a alguién me sentería agradecido si se recomienda el link y se comparte. Contenido del libro El contenido será en castellano con la salvedad de los títulos, palabras que no tenga sentido traducir o conectos de Angular/TypesScript que serán en inglés. Esto facilita la búsqueda de información por internet. Dejando únicamente la explicación de los conceptos en castellano. Por supuesto muchas veces dentro del contenido se mezclarán terminos en inglés con explicaciones en castellano. Cabe destacar que el contenido está actualmente en desarrollo y seguirá así. Quiero que sea una fuente viva y que vaya evolucinando con las nuevas versiones de Angular. Notas De ahora en adelante cuando hablemos de Angular nos estaremos refieriendo únicamente a Angular 2. Código Los contenidos de código se identificará así: // app.component.ts import {Component} from 'angular2/core'; @Component({ selector: 'my-app' }) export class AppComponent {} Introducción 3 Libro Angular 2 Todos los códigos que se incluyan estarán probados y se adjuntará la versión de Angular con los que se han desarrollado. Opcionalmente si el ejemplo lo necesita se añadirá un link hacía un editor online tipo: plunker, jsbin, jsfiddle, etc. Enlaces Y los links hacia la fuente original o de ampliación de información así: Página oficial de Angular Erratas Pido disculpa de antemano por las posibles faltas de ortografía que intentaré sean la mínimas posibles. De todas formas se realizará una revisión de textos y códigos cada cierto tiempo. Cualquier error o amplicaición de contenido lo podéis notificar a través de mi cuenta de github. Licencia El contenido del libro se encuentra bajo licencia MIT. Introducción 4 Libro Angular 2 ¿Por qué Angular 2? Ventajas de Angular 2 con respecto a Angular 1.x 1. Contruido para ser rápido 2. Código moderno 3. API simplificada 4. Mejora la productividad ¿Por qué Angular 2? 5 Libro Angular 2 Prerequisitos Los conocociemientos necesarios para empezar a trabajar con Angular 2 son los siguientes: Requerido JavaScript HTML5 CSS3 Ayuda Conceptos de Orientación a objetos Familiarizado con Java, C++ o C# No requerido Experiencia previa con Angular 1.x Experiencia previa con TypeScript Semilla https://jakearchibald.com/2014/offline-cookbook/#cache-then-network Prerequisitos 6 Libro Angular 2 Enviorement La instalación del entorno de trabajo se basará únicamente en sistemas linux/mac. La diferencia para usuario windows no suele ser muy disitinta. Instalar: node.js + npm Enviorement 7 Libro Angular 2 Dependencias Listado de depencias de un proyecto Angular 2. Dependencias 8 Libro Angular 2 Arquitectura Una app de Angular 2 está basada en components Una arquitectura de ejemplo de una app con Angular 2 Arquitectura 9 Libro Angular 2 TypeScript ¿Por qué TypeScript? Es un lenguaje Open Source Es un superset de JavaScript Transpila a JavaScript nativo Fuertemente tipado Orientación a objetos basado en clases (Java, C#, C++...) Editores Visual Studio Visual Studio Code WebStorm Atom + package Eclipse Características: Interfaces Inheritance Modules TypeScript 10 Libro Angular 2 Components Angular 2 está basado en componentes. Su estructura básica es la siguiente Components 11 Libro Angular 2 Lifecycle El ciclo de vida de un componente Lifecycle 12 Libro Angular 2 Styles ¿Cómo añadir estilos CSS a lo template de un component? Styles 13 Libro Angular 2 Templates template templateUrl Templates 14 Libro Angular 2 Data Binding Formas de rederizado y comunuicación entre un component y su template. Data Binding 15 Libro Angular 2 Directives Básicamente son components sin template. Directives 16 Libro Angular 2 Pipes En Angular 1.x eran conocidos por filters. Pipes 17 Libro Angular 2 Routing ¿Cómo se realiza la navegación en una app de Angular 2? Routing 18 Libro Angular 2 Resolve ¿Cómo realizar navegación entre templates con el los datos previamente cargados? Resolve 19 Libro Angular 2 ui-router ¿Tenemos disponible ui-router en Angular 2? ¿Tiene sentido? Existe una versión aplha https://github.com/angular-ui/ui-router/tags ui-router 20 Libro Angular 2 Http Recuperando datos a través de Http. Http 21 Libro Angular 2 Services Creando servicios para organizar las llamadas Http y como realizar la injección de dichos servicios. Services 22 Libro Angular 2 Firebase ¿Cómo integrar Firebase con Angular 2? Firebase 23 Libro Angular 2 RxJS RxJS 24 Libro Angular 2 Observables ¿Cómo se comunican los components? Observables 25 Libro Angular 2 Forms En el desarrollo web los formularios son complicados. ¿Cómo funcionan los formularios en Angular? Forms 26 Libro Angular 2 Tests Los tests hoy en día son imprecindibles para el desarrollo de software. Cómo testear una app Angular con: Karma Jasmine Tests 27 Libro Angular 2 TDD TDD 28 Libro Angular 2 BDD BDD 29