Presentación del proyecto: AngularDex
Te presento AngularDex, con este proyecto vamos a consolidar todos los conceptos que aprenderemos a lo largo del curso, tales como:
- Componentes
- Enrutamiento
- Módulos
- Servicios (incluídas llamadas API)
- Directivas
Recuerda que tienes la guía paso a paso para inicializar el proyecto.
Componiendo el proyecto
La imagen es bastante autodescriptiva, pero vamos a desgranar más detalladamente:
Rutas
La página oficial tiene varias rutas, Inicio, Pokédex, Videojuegos y aplicaciones…, realmente a nosotros solo nos interesan las dos primeras + una extra que utilizaremos para visualizar el detalle de los pokemon.
Módulos
Vamos a encapsular cada ruta en un módulo independiente, de esta manera vamos a tener una estructura más limpia además de aprovecharnos del “lazy loading”. Estos módulos contendrán aquellos componentes y servicios que se utilicen exclusivamente en este ámbito.
Componentes
Realmente cada elemento de la Interfaz de Usuario es, o debería ser, un Componente. Al ver esta pantalla nuestro instinto de programador salta y percibe un patrón claro, los pokémon son elementos repetitivos donde tan solo varían la imagen, número, nombre y tipo de cada pokémon ¿qué significa esto? que si maquetamos la “plantilla” y conseguimos que la información se obtenga de manera dinámica tan solo tendremos que crear un Componente que se reutilizará para todos.
Directivas
Vamos a utilizar una directiva personalizada para que dependiendo del tipo del pokemon se muestre el color correspondiente.
Servicios
Como aprenderemos a lo largo del curso, los servicios se suelen utilizar para realizar llamadas a APIs o para compartir datos en un contexto definido. En nuestro caso vamos a realizar un acción clara, que será filtrar por nombre o por número del pokemon, lo que significa que realizaremos una llamada a la API con esos datos.
¡Espero que este proyecto te entusiasme tanto como a mí! Te aseguro que después de realizarlo serás capaz de desarrollar de manera autónoma lo que te propongas.