HTTP En este tutorial añadiremos las siguientes características sobre persistencia de datos, con la ayuda de HttpClient de Angular. HeroService obtendrá datos mediante peticiones HTTP. Los usuarios podrán añadir, editar y borrar héroes y guardar estos cambios por HTTP. Los usuarios podrán buscar héroes por nombre. Cuando hayas terminado con… Leer más »
Enrutamiento Hemos recibido nuevos requisitos para nuestra aplicación Tour de Héroes. Añadir un Cuadro de Mandos (dashboard). Añadir la posibilidad de navegar entre el Cuadro de Mandos y la página de los héroes. Cuando un usuario haga clic en cualquiera de las dos vistas, navegar a una vista de detalles… Leer más »
Servicios El componente HeroesComponent de Tour de Héroes actualmente obtiene y muestra datos simulados. Después de la refactorización de este tutorial, HeroesComponent estará enfocado en dar soporte a la vista. Además, esto facilitará los tests unitarios a través de un servicio simulado (mock). ¿Por qué servicios? Los componentes no debería… Leer más »
Componentes Maestro/Detalle Por el momento, HeroesComponent muestra tanto la lista de héroes como los detalles del héroe seleccionado. Mantener todas las características en un sólo componente a medida que la aplicación crece no sería fácil de mantener. Es mejor dividir los componentes grandes en sub-componentes de menor tamaño, cada uno… Leer más »
Mostrar un listado de Héroes En esta página, ampliaremos la aplicación Tour de Héroes para que muestre un listado de héroes y permita que los usuarios seleccionen un héroe, mostrándose su detalle. Crear héroes de prueba Vamos a necesitar algunos héroes que mostrar. En una versión final, los obtendremos de… Leer más »
El editor de Héroes La aplicación ya tiene su título. Ahora crearemos un nuevo componente para mostrar la información del héroe y colocaremos dicho componente en el caparazón de la aplicación. Crea el componente heroes Usando el CLI de Angular, generamos un nuevo componente llamado heroes.
|
1 2 3 |
ng generate component heroes |
CLI crea una… Leer más »
El caparazón de aplicación Instala el CLI de Angular (interfaz de línea de comandos) Instala el CLI de Angular, si todavía no lo has hecho
|
1 2 3 |
npm install -g @angular/cli |
Crea una nueva aplicación Crea un nuevo proyecto llamado angular-tour-of-heroes con este comando de CLI
|
1 2 3 |
ng new angular-tour-of-heroes |
El CLI de Angular ha generado un nuevo… Leer más »
Vamos a dedicar esta entrada a uno de los lenguajes que ha ganado mayor popularidad estos últimos años: Angular, un framework de Google para el desarrollo de aplicaciones web. Dentro de su página web oficial, https://angular.io/ encontraremos el tutorial ‘Tour of Heroes’, que aquí podéis encontrar traducido al español. !Empezamos! Tutorial: Tour… Leer más »