Este libro se dirige a cualquier informático que desee optimizar el desarrollo industrial de sus aplicaciones web, con la implementación de una arquitectura MEAN (basada en MongoDB, el framework Express, el framework Angular y un servidor Node.js). El autor le da las claves para cumplir con los nuevos requisitos cada vez más exigentes, de este tipo de desarrollo, a saber, la necesidad de reutilizar componentes de software para aumentar la productividad del desarrollo y la optimización de la carga del servidor, que no para de aumentar.

El desarrollo de una aplicación Angular dentro de una arquitectura MEAN, se beneficia de la consistencia del uso de JavaScript y su extensión TypeScript, a nivel del cliente y del servidor. En los primeros dos capítulos, el lector encontrará la información necesaria para comprender este lenguaje, que permite la programación orientada a objetos con clases. A continuación se detallan, por un lado, la implementación de un servidor Node.js extremadamente reactivo y por otro lado, el framework de aplicación Angular (en la versión 8 en el momento de la escritura de este libro). Esto le permite crear aplicaciones de una sola página (interactuando con el servidor solo para intercambiar datos) y demuestra una modularidad ejemplar, organizada en dos niveles: módulos y componentes. El libro también presenta el sistema de gestión de base de datos NoSQL MongoDB que, combinado con los otros dos pilares de la arquitectura, permitirá un acceso eficiente a un volumen muy alto de datos.

Siendo la visualización de información un área emblemática de Angular, también se estudia la visualización de gráficos y la anotación gráfica de Google Maps. Por último, también se presenta al final del libro el uso de tres librerías de componentes gráficos muy populares (PrimeNG, Material y ngx-bootstrap).

A lo largo del libro, un hilo común con numerosos ejemplos de código guía al lector hacia la creación de una aplicación de comercio electrónico, un ejemplo ideal para ilustrar la implementación de una arquitectura MEAN.

¡Nuevo! Rondas de preguntas disponibles con la versión online.

¡Ronda de preguntas
incluida en
la versión online !

• Ponga a prueba sus conocimientos al final de cada capítulo
• Evalúe sus competencias

Descargas

• Descargar los ejemplos del libro (1.75 Mo)

Prólogo

1. Organización de este trabajo

Introducción

1. Introducción
2. La arquitectura MEAN para una aplicación web
   1. 1. El principio de las aplicaciones mono página(single page applications)
   2. 2. El paradigma de diseño modelo vista-controlador
3. Angular en el centro de la arquitectura MEAN
4. Presentación de El hilo rojo: una aplicación de e-commerce

El lenguaje JavaScript

1. Introducción a JavaScript
   1. 1. Breve repaso histórico
   2. 2. Panorama de la utilización de JavaScript
   3. 3. Las librerías y los frameworks aplicativosJavaScript
2. ¿Dónde escribir código JavaScript?
3. Las herramientas del navegador y la depuración
4. Los elementos de programación básicos
   1. 1. Las variables
      1. a. Los tipos internos
      2. b. El transtipado
   2. 2. Las estructuras de datos comunes
   3. 3. Aplicación de expresiones regulares
   4. 4. Los bloques de instrucciones
   5. 5. Las estructuras condicionales
      1. a. La estructura if ... else ...
      2. b. La estructura switch de conmutador múltiple
   6. 6. Las estructuras iterativas
      1. a. Las estructuras iterativas con índices debucle
      2. b. Las estructuras iterativas sin índices debucle
5. La programación funcional en JavaScript
   1. 1. Una función que se pasa como argumento (funciónde callback)
      1. a. Ejemplo con el método forEach()
      2. b. Ejemplo con el método map()
   2. 2. Una función devuelve una función(factory)
6. La programación orientada a objetos con JavaScript
   1. 1. Los principios de la programación orientadaa objetos con JavaScript
   2. 2. Los objetos literales
   3. 3. La herencia por encadenamiento de prototipos
      1. a. La propiedad __proto__ delobjeto del que heredan
      2. b. La propiedad prototype
   4. 4. La creación de un objeto por medio de lallamada de una función constructora
   5. 5. Ejemplos de implementaciones de un método
   6. 6. La problemática del objeto actual (this)
   7. 7. La herencia
   8. 8. El encadenamiento de métodos
7. Las principales aportaciones de la norme ECMAScript 6
   1. 1. La norma ECMAScript
   2. 2. La palabra reservada let
   3. 3. La interpolación de variables en las cadenas
   4. 4. Los argumentos por defecto
   5. 5. Una manipulación más cómodade las listas
      1. a. La estructura for (... of …) ...
      2. b. El método includes()
   6. 6. El operador "fat arrow" (=>)
   7. 7. Las clases
8. La programación reactiva, observables y promises (promesas)
   1. 1. Primer ejemplo: un observable en un botón
   2. 2. Segundo ejemplo: un observable sobre un entero
   3. 3. Tercer ejemplo: un observable sobre un timer
   4. 4. Las promises

Extensiones JavaScript para las clases

1. Presentación de las extensiones de JavaScript
2. El lenguaje TypeScript
   1. 1. El transpiler tsc
   2. 2. Tipado estático de las variables
      1. a. Los tipos básicos
      2. b. Tipado de variables no escalares
      3. c. El tipo enum
      4. d. El tipo genérico any
      5. e. Tipado de las funciones
   3. 3. Las clases
      1. a. La herencia
      2. b. Las interfaces
      3. c. La programación genérica
3. El lenguaje Dart
   1. 1. Instalación y prueba de Dart
   2. 2. Generación del código JavaScriptcon Dart
   3. 3. Las clases
      1. a. La herencia
      2. b. Las interfaces

La plataforma Node.js

1. Presentación de Node.js
2. Instalación y prueba de Node.js
   1. 1. Creación del archivo de prueba
   2. 2. Instalación y prueba de Node.js en Ubuntu
   3. 3. Instalación y prueba de Node.js en Windows
   4. 4. Instalación y prueba de Node.js en Mac OS
3. La modularidad de Node.js
   1. 1. Los módulos y los paquetes
      1. a. El administrador de módulos de Node.js: npm
      2. b. Especificación de las dependencias: el archivopackage.json
   2. 2. Creación de un primer servidor Node.js deprueba
   3. 3. Creación y reutilización de un módulo
   4. 4. Creación de un servidor que devuelva losdatos
   5. 5. El módulo express
      1. a. Gestión de rutas REST con el móduloexpress
      2. b. Gestión de las plantillas con el móduloexpress
      3. c. Especificación de las dependencias en unarchivo package.json
      4. d. Instalación del módulo express
   6. 6. El módulo fs (FileSystem)
   7. 7. Prueba de un servidor Node.js
      1. a. Creación de un archivo de datos JSON
      2. b. La problemática del control de acceso HTTP
      3. c. Retorno al cliente de un archivo JSON
      4. d. Configuración de las rutas
      5. e. Gestión de los argumentos
4. Securización de un servidor Node.js (protocolo HTTPS)
   1. 1. Creación de la autoridad de certificación
   2. 2. Creación del certificado
   3. 3. Creación del servidor
5. Conocimientos adquiridos en este capítulo

El SGBD NoSQL MongoDB

1. Introducción
2. ¿Por qué utilizar una base de datos NoSQL?
3. Presentación de MongoDB
   1. 1. Las colecciones y los documentos
   2. 2. Los índices
4. Implementación de MongoDB
   1. 1. Instalación de MongoDB
      1. a. Instalación de MongoDB en Linux
      2. b. Instalación de MongoDB en Windows o en MacOS
      3. c. Utilización de MongoDB en líneade comandos
   2. 2. Visualización de la lista de las bases dedatos
   3. 3. Creación de una base de datos
   4. 4. Visualización de la lista de las colecciones
   5. 5. Creación de una colección
      1. a. Inserción de los documentos en una colección
      2. b. Importación de documentos a partir de unarchivo
      3. c. Exportación de los documentos de una colecciónen un archivo JSON
   6. 6. Interrogación de una colección
      1. a. Interrogación a través de un objeto"filtro"
      2. b. Los operadores de comparación, los operadoresde conjuntos y lógicos
      3. c. El operador $exists
      4. d. El operador $in
      5. e. El operador $nin
      6. f. El operador $or
      7. g. El operador $not
      8. h. El operador $nor
   7. 7. Aplicación de expresiones regulares
   8. 8. Las proyecciones y el método distinct()
      1. a. Las proyecciones
      2. b. El método distinct()
   9. 9. Referenciado los documentos y joins
      1. a. Los objetos anidados (nested objects)
      2. b. Los objetos referenciados
      3. c. Los joins
   10. 10. Actualización y eliminación de undocumento
       1. a. Actualización de un documento
       2. b. Eliminación de un documento
   11. 11. Eliminación de una colección
5. Utilización de MongoDB a través de Node.js
   1. 1. Instalación del módulo MongoDB paraNode.js
   2. 2. Conexión al servidor MongoDB
   3. 3. Inserción de datos desde un servidor Node.js
   4. 4. Consultar datos desde un servidor Node.js
      1. a. Explotación del resultado del métodofind()
      2. b. Utilización del método toArray()
   5. 5. Sincronización de las consultas
      1. a. Utilización de las funciones de callback
      2. b. Utilización del módulo async
      3. c. El método async.series()
      4. d. El método async.waterfall()
6. Interrogación de MongoDB con las rutas gestionadas por express
   1. 1. La estructura de un servidor Node.js que consultaa MongoDB
   2. 2. La problemática del cross-origin resourcesharing
   3. 3. Ejemplos de gestión de rutas
      1. a. Gestión de una ruta para listar las marcas
      2. b. Gestión de una ruta para filtrar los productos
      3. c. Búsqueda de un producto a partir de su identificadorinterno
7. El hilo rojo del lado servidor
   1. 1. Creación de la colección
   2. 2. Implementación de dos búsquedassobre los productos
      1. a. La superestructura del servidor
      2. b. Gestión de la ruta que filtra los documentosusando diferentes criterios
      3. c. Gestión de la ruta que devuelve un documentoa través de su identificador interno
      4. d. Ejemplos de consulta en el servidor
8. Conocimientos adquiridos en este capítulo

Introducción al framework aplicativo Angular

1. Presentación de Angular
   1. 1. Una evolución radical de AngularJS
   2. 2. La modularidad de la aplicación: los módulosy los componentes
      1. a. Los módulos
      2. b. Los componentes y los servicios
   3. 3. Manipulación de los componentes como etiquetas
   4. 4. Utilización de una extensión enJavaScript (TypeScript o Dart)
2. Angular respecto al framework MVC (incluso VVM)
3. Implementación de una aplicación Angular
   1. 1. Presentación de Angular CLI
   2. 2. Instalación de Angular CLI
   3. 3. Creación de un proyecto Angular con AngularCLI
   4. 4. Estructura de las carpetas de un proyecto AngularCLI
   5. 5. Un primer componente creado por Angular CLI
   6. 6. El root module creado por Angular CLI
   7. 7. Actualización de Angular a travésde Angular CLI
4. Generación del código JavaScript a partir de TypeScript
5. Los decoradores
6. Creación de un nuevo componente que muestra un mensaje
   1. 1. Creación del componente
      1. a. La plantilla HTML
      2. b. La hoja de estilos
   2. 2. Interfaz de componentes en el componente raíz
   3. 3. Especificación de los componentes en el módulo
   4. 4. Activación del módulo
   5. 5. La página web front
7. El ciclo de vida de un componente
   1. 1. El hook ngOnChanges()
   2. 2. El hook ngOnInit()
   3. 3. El hook ngDoCheck()
   4. 4. El hook ngOnDestroy()
8. Conocimientos adquiridos en este capítulo

Angular: las plantillas, bindings y directivas

1. Las plantillas
   1. 1. Anidación de las plantillas
   2. 2. Las plantillas insertadas (embedded templates)
   3. 3. Las plantillas externalizadas
2. Data bindings entre el componente y la plantilla
   1. 1. Acceso a los elementos del DOM
   2. 2. Interpolación de una variable en una plantilla
   3. 3. Property binding
   4. 4. Event binding
   5. 5. Two-way data binding
3. Las directivas
   1. 1. Las directivas estructurales
      1. a. La directiva *ngFor
      2. b. La directiva *ngIf
   2. 2. Las directivas de atributos
   3. 3. Envío de información de un componentea su padre (@Output())
4. Los pipes
5. Ejemplo de resumen: un formulario de autenticación
6. El hilo rojo: creación de un componente que muestra los productos
   1. 1. El componente
      1. a. La clase que implementa el componente
      2. b. La plantilla HTML
      3. c. La hoja de estilos
   2. 2. El módulo que especifica el componente
   3. 3. Activación del módulo
   4. 4. La página web front
   5. 5. Lanzamiento de la aplicación
7. Conocimientos adquiridos en este capítulo

Angular y la conexión a Node.js: los servicios

1. Introducción
2. Inyección de dependencias
3. Utilización de los servicios para la transferencia de datos
   1. 1. Recuperación de datos formateados en JSON
   2. 2. Envío de datos JSON al servidor
   3. 3. Envío de datos a través de Querystring
4. Implementación de los servicios en El hilo rojo
   1. 1. Declaración de las rutas del lado servidor
   2. 2. Gestión de los productos
      1. a. Visualización de los selectores
      2. b. Visualización de los productos segúnlos criterios de búsqueda
      3. c. Visualización de los productos asociadosa las palabras clave
      4. d. Acceso a un producto por su identificador
   3. 3. Gestión de la cesta de la compra
      1. a. Visualización de los identificadores de losproductos de la cesta de la compra
      2. b. Visualización de todos los productos de lacesta de la compra
      3. c. Adición de un producto en la cesta de lacompra
      4. d. Eliminación de un producto de la cesta dela compra
      5. e. Reinicialización de la cesta de la compra
5. La librería NgRx y los stores
6. Conocimientos adquiridos en este capítulo

Angular y la gestión de las rutas internas

1. Principio general del enrutado
   1. 1. ¿Por qué establecer un enrutado?
   2. 2. Las rutas, el router, las tablas de enrutado
   3. 3. Las vistas activadas por las rutas
   4. 4. Ejemplo de enrutado
   5. 5. Definición de un árbol de vistas
   6. 6. Utilización de los outlets con nombre
2. La sintaxis de las rutas
   1. 1. Las dos sintaxis de una ruta: cadena o link parametersarray
   2. 2. Las rutas absolutas y las rutas relativas
   3. 3. Configuración de las rutas
   4. 4. Asociación de una ruta a un auxiliary outlet
3. Selección de las rutas
   1. 1. La directiva routerLink
   2. 2. El método navigate()
   3. 3. Ejemplo de ruta
4. Gestión de las rutas del controlador hacia el componente destino
   1. 1. Configuración de la tabla de enrutado
   2. 2. Las propiedades de una ruta
   3. 3. Soporte de una ruta por varios módulos/tablasde enrutado
   4. 4. Control de las rutas: guardián
   5. 5. Invocación de un componente
   6. 6. Captura de una ruta durante la invocaciónde un componente
5. Gestión de rutas en El hilo rojo
   1. 1. El módulo de enrutado asociado al root module
   2. 2. El módulo de enrutado asociado al featuremodule research
   3. 3. El módulo de enrutado asociado al featuremodule cart
6. Conocimientos adquiridos en este capítulo

Angular y la visualización de información

1. Introducción
2. Creación de charts con D3.js y dc.js
   1. 1. Instalación de D3.js
   2. 2. El lenguaje SVG
   3. 3. Generación de elementos gráficosasociados a los objetos de una colección
   4. 4. Selección y modificación de elementosdel DOM
      1. a. Adición de elementos gráficos
      2. b. Sustitución de elementos gráficos
   5. 5. Implementación de listeners de eventos
   6. 6. Integración de D3.js en Angular
      1. a. Un servidor virtual de datos comerciales
      2. b. El servicio que accede a los datos del servidor
      3. c. La plantilla del componente que muestra un histograma
      4. d. Implementación del componente que muestraun histograma
   7. 7. Las librerías dc.js y Crossfilter
      1. a. Instalación de dc.js y de Crossfilter
      2. b. Implementación del componente que muestrael histograma
3. Integración de mapas Google Map en un proyecto Angular
   1. 1. Instalación de los requisitos previos técnicos
      1. a. Instalación de los tipos TypeScript
      2. b. Instalación de la librería PrimeNG
   2. 2. Presentación de un mapa Google Map estático
   3. 3. Un componente PrimeNG para gestionar un mapa Google Map
   4. 4. Gestión de un chart asociado a un GoogleMap
4. Implementación de componentes gráficos
   1. 1. Otro ejemplo de componente PrimeNG (Calendar)
   2. 2. La librería de componentes Material
   3. 3. La librería ngx-bootstrap
5. Conocimientos adquiridos en este capítulo

Prueba y despliegue

1. Test
2. Despliegue
   1. 1. Despliegue con Apache
   2. 2. Despliegue con Node.js
   3. 3. Despliegue con http-server (acceso directo a Node.js)
3. Para ir más lejos