Pokemon App

Link a deploy:

Esta app fue realizada para la etapa "Proyecto Individual" de Labs del bootcamp Henry.
Tiempo de desarrollo: 2 semanas.
No estaba permitdo usar librerías ni frameworks CSS (Boostrap, MaterialUI, etc) por lo cual todos los modales, funcionalidad de botones y estilos se realizaron utilizando HTML CSS Y JS puro.

Realizado utilizando el stack de tecnologías HTML, CSS, Javascript, React, Redux, Node.JS, Express, Sequelize y PostgreSQL.

Muestra la lista completa de Pokemons en formato de tarjetas, cada una con su nombre, imagen e ícono representativo del tipo de Pokemon al que pertenece (agua, fuego, etc).
Se realiza un paginando mostrando de a 9 tarjetas por página.
En el display superior nos muestra cuántos Pokemones está listando actualmente.
Podemos filtrar por tipo (agua, fuego, etc.) y por categoría (originales o creados por el usuario) de Pokemon.
Dentro de lo que estamos listando, podemos cambiar el criterio y sentido del ordenamiento (id, nombre, ataque).
Al pie de la pantalla tenemos el paginado con botones que se activan únicamente cuando son necesarios.
El campo de búsqueda por nombre funciona reactivamente buscando en tiempo real (no se necesita presionar un botó) y devuelve la tarjeta del Pokemon buscando sólo si coincide el nombre completo (según lo solicitado para el proyecto).
Si hacemos click sobre cualquier tarjeta nos abre la Pokedex (Detalles del Pokemon).

Nos muestra toda la información de ese Pokemon (id, nombre, imagen, tipo/s, y estadísticas).
La imagen tiene una animacion donde el pokemon salta cuando el puntero está sobre él.
Cuando cerramos el Pokedex la pantalla anterior se encuentra en el mismo estado en el que estaba.
Para los creados por el usuario, incluye: un botón para eliminar el Pokemon, removiéndolo definitivamnete de la base de datos (con pantalla de confirmación) y botón para renombrar, realizando un update en el registro de la DB.

Posee un formulario controlado donde ingresamos los datos necesarios para crear un nuevo Pokemon.
A medida que completamos los campos, el display superior nos advierte de errores.
Además, vemos de cada campo su estado de válido / erróneo con un ícono representativo a su lado.
El nombre no puede ser repetido de un Pokemon ya existente (ya sea original o creado).

Para los puntos de vida, velocidad, ataque y defensa, se implementó un sistema de asignación de 250 puntos como máximo; mostrando los puntos remanentes. En caso de superar el maximo permito, no se permite crear el Pokemon.
Sólo se pueden seleccionar hasta 2 'tipos', a partir de entonces el resto queda deshabilitado. Podemos cambiar la selección y volver a elegir.
El boton de CREATE sólo se habilita si todos los campos estan aprobados.

Al confirmar se realiza la operación en el servidor y nos muestra en pantalla la respuesta que nos envía el mismo (éxito o error).
Luego al cabo de unos segundos automáticamente nos devuelve al Home.