Sinopsis

Este libro está dirigido a desarrolladores que quieran aprender a desarrollar una aplicación web con el framework de JavaScript mantenido por Google: Angular. Se coloca al lector en un marco metodológico Agile Scrum que le permite asimilar los mecanismos de desarrollo en un contexto profesional.

Escrito en dos partes, el autor detalla en la primera parte del libro los conceptos de JavaScript, tanto básicos como avanzados, ilustrándolos con ejemplos. El lector puede así familiarizarse con la instalación del IDE, los tipos de datos, los bucles y las condiciones, las funciones o la programación orientada a objetos con JavaScript. Un capítulo dedicado a TypeScript permite al lector establecer el vínculo entre el lenguaje JavaScript y el framework Angular.

En la segunda parte, el autor estudia paso a paso los mecanismos de Angular gracias a los conceptos adquiridos mediante la práctica que se desarrolla en cada capítulo para realizar una aplicación. El lector puede así implementar los componentes y su jerarquía, las plantillas, las API, los formularios, el enrutamiento, la programación reactiva, las pruebas unitarias y de extremo a extremo, la autenticación, el funcionamiento de una base de datos con Fire- Base y la integración continua con Travis para dar como resultado muy rápidamente una aplicación completamente funcional. Varias herramientas también están diseñadas para poder calificar y auditar el propio código y así ganar en productividad.

¡Nuevo! Los quiz estan disponibles con la versión online gratuita durante un año.

Índice

Histórico

1. Internet
1.1 Una red para unirlos a todos
1.2 TCP/IP
1.3 Navegadores y WWW
2. JavaScript
2.1 Validar un formulario
2.2 ECMAScript
2.3 DOM
2.4 Variaciones
2.5 JavaScript y la web
3. Angular
3.1 AngularJS
3.2 Angular 2
3.3 Versiones siguientes

Instalación

1. Introducción
2. Visual Studio Code
2.1 Instalación
2.1.1 Windows
2.1.2 Linux
2.2 Interfaz
3. Google Chrome
4. git
5. Node.js
6. npm
7. Angular CLI
8. Estructura de este libro

Tipos de datos

1. Introducción
2. Declaración de una variable
3. Números
3.1 Tipos de números
3.2 Operaciones elementales
3.3 Números decimales
3.4 Sintaxis simplificada
3.4.1 Incremento y decremento
3.4.2 Operaciones matemáticas comunes
4. Cadenas de carácteres
4.1 Declaración e inicialización
4.2 Concatenación
5. Arrays
5.1 Declaración e inicialización
5.2 Acceso
5.3 Modificación
5.4 Funciones útiles
5.4.1 push y unshift
5.4.2 pop y shift
5.4.3 indexOf
6. Práctica
6.1 Enunciado
6.2 Corrección

Bucles y condiciones

1. Condiciones
1.1 Operadores lógicos
1.1.1 Y
1.1.2 O
1.1.3 NO
1.1.4 Evaluación
1.1.5 Prioridad de las operaciones
1.2 Sintaxis
1.2.1 if
1.2.2 if... else
1.2.3 Operador ternario
1.2.4 switch
2. Bucles
2.1 while
2.1.1 Sintaxis
2.1.2 Al infinito y más allá
2.1.3 Ejemplo
2.1.4 Versión alternativa
2.2 for
2.2.1 Sintaxis
2.2.2 FizzBuzz
2.2.3 Optimización para índices de lista y de objetos
3. Práctica
3.1 Enunciado
3.2 Corrección

Funciones

1. Introducción
2. Funciones simples
2.1 Sintaxis
2.2 Ámbito
2.2.1 Ámbito global
2.2.2 Ámbito local
3. Funciones y argumentos
3.1 Sintaxis de la función con argumentos
3.2 Llamada a la función con argumentos
3.3 Valor por defecto de los argumentos
3.4 Número de argumentos indefinido
4. Retorno
4.1 Sintaxis
4.2 Uso de un retorno de función
5. Funciones o métodos
6. Práctica
6.1 Enunciado
6.2 Corrección

JavaScript orientado objetos

1. Definición
2. Creación de un objeto
3. Bob el constructor
4. Propiedades y métodos
5. Clases
5.1 Constructor
5.2 Métodos
5.2.1 Getters y setters
5.2.2 Métodos y atributos estáticos
6. Práctica
6.1 Enunciado
6.1.1 Pokémon
6.1.2 Ataque
6.1.3 Combate
6.2 Corrección
6.2.1 Pokémon
6.2.2 Ataque
6.2.3 Combate

TypeScript

1. Historia
2. Integrar TypeScript en un proyecto web
2.1 npm
2.2 Creación de un archivo TypeScript
3. Tipado
3.1 JavaScript y los errores de tipado
3.2 TypeScript y el tipado
3.3 Errores de compilación
3.4 Tipos
4. Enumeraciones
4.1 Declaración
4.2 Uso de una variable de tipo enumeración
5. Funciones
5.1 Generalidades
5.2 Funciones particulares
5.2.1 Funciones anónimas
5.2.2 Funciones flecha
6. Clases y herencia
6.1 Clase mínima
6.2 Atributos
6.3 Accesores
6.4 Constructor
6.5 Métodos
6.6 Herencia
7. Módulos
8. Práctica
8.1 Enunciado
8.2 Corrección

Angular CLI - Componentes

1. Introducción
2. Creación de una nueva aplicación Angular
2.1 Generación de un nuevo proyecto con AngularCLI
2.2 Arquitectura de un proyecto generado
3. Componentes
3.1 Clase TypeScript
3.2 Decorador
3.3 Metadatos
3.4 Añadir al módulo principal
3.5 Uso de un componente
4. Angular CLI y la creación de componentes
4.1 Generar un componente con AngularCLI
4.2 Los métodos que intervienen en el ciclo de vida de un componente Angular
5. Práctica
5.1 Enunciado
5.2 Corrección

Plantillas

1. Introducción
2. Bootstrap
3. Interpolación
4. Eventos
5. Directivas
5.1 Directivas estructurales
5.1.1 Condiciones
5.1.2 Iteraciones
5.1.3 Opciones múltiples
5.2 Directivas de datos
5.2.1 Clases
5.2.2 Estilo
6. Práctica
6.1 Enunciado
6.2 Corrección

Formateo en plantillas

1. Introducción
2. Usa pipes con las cadenas de caracteres
3. Usar pipes con los números
3.1 DecimalPipe
3.2 PercentPipe
3.3 CurrencyPipe
4. Usar pipes con las fechas
5. Usar pipes en un objeto o un diccionario
5.1 KeyValuePipe
6. Usar pipes en arrays y cadenas de caracteres
6.1 SlicePipe
7. Usar pipes con objetos que vienen de API externas
7.1 JsonPipe
7.2 AsyncPipe
8. Práctica
8.1 Enunciado
8.2 Corrección

Jerarquía de componentes

1. Arquitectura jerárquica
2. Transmisión padre-hijo
3. Transmisión hijo-padre
4. Práctica
4.1 Enunciado
4.2 Corección

Servicios

1. Introducción
2. Dependencias
3. Servicios
4. Ejemplo de servicio
5. CRUD y los servicios
6. Práctica
6.1 Enunciado
6.2 Corrección

Formularios

1. Introducción
2. Crear un formulario HTML
3. Crear un formulario Angular
3.1 Método 1: dentro de una plantilla
3.1.1 FormsModule
3.1.2 Interpolación
3.1.3 Vincular el formulario a un modelo
3.2 Método 2: dentro de una clase TypeScript
3.2.1 ReactiveFormsModule
3.2.2 Crear un formulario TypeScript
3.2.3 Vincular cada campo HTML al formulario TypeScript
3.2.4 FormBuilder
4. Enviar un formulario
5. Práctica
5.1 Enunciado
5.2 Corrección

Gestión avanzada de los formularios

1. Introducción
2. Validación de campos de entrada
2.1 En un formulario basado en una plantilla
2.2 En un formulario basado en una clase TypeScript
3. Validadores personalizados
4. Formateo según validadores
4.1 NgModel y sus booleanos de componentes
4.2 Formateo según validadores
4.2.1 Informar de un error en un campo con un mensaje
4.2.2 Encuadrar un campo
5. Práctica
5.1 Enunciado
5.2 Corrección

Enrutamiento

1. Introducción
2. Angular CLI y el enrutamiento
3. href != routerLink
4. app-routing.module.ts
5. Rutas
5.1 Ruta comodín
5.2 Rutas parametrizadas
5.2.1 La navegación dentro de la plantilla
5.2.2 La navegación en un componente TypeScript
5.2.3 Usar el parámetro de URL en un componente
6. Jerarquía en las rutas
6.1 Creación de cuatro componentes
6.2 Rutas secundarias
6.3 Implementación de los componentes hijos
7. Permisos
8. Práctica
8.1 Enunciado
8.2 Corrección

Programación reactiva

1. Introducción
2. Promesa
2.1 Instanciar una promesa
2.2 Función de devolución de llamada
3. Observable
3.1 Generalidades
3.2 rxjs
4. HTTP: HyperText Transfer Protocol
5. Práctica
5.1 Enunciado
5.1.1 Generaciones
5.1.2 Pokémon
5.2 Corrección
5.2.1 Generaciones
5.2.2 Pokémon

Test unitarios

1. Introducción
2. Jasmine
2.1 Test unitarios básicos
2.2 Fixture
2.3 Ejecutar los test unitarios
3. Test unitarios de un componente Angular
3.1 Clase TypeScript
3.2 Plantilla
3.3 Dependencias
4. Karma
5. Cobertura de código
6. Práctica
6.1 Enunciado
6.2 Corrección

Test de extremo a extremo

1. Introducción
2. Protractor
2.1 Objeto página
2.2 Test e2e
3. Probar las acciones del usuario
3.1 Modificar el objeto página
3.2 Añadir dos test
4. ¿Y aparte de hacer clic?
4.1 A nivel del navegador
4.2 A nivel de un elemento
5. Caso concreto: una lista y botones
6. Práctica
6.1 Enunciado
6.2 Corrección
6.2.1 Página principal
6.2.2 Página Generaciones
6.2.3 Página Pokémons
6.2.4 Ejecutar los test

Herramientas complementarias