- Construir una App utlizando React, Redux, Node y Sequelize.
- Afirmar y conectar los conceptos aprendidos en la carrera.
- Aprender mejores prácticas.
- Aprender y practicar el workflow de GIT.
- Usar y practicar testing.
A idea general es crear una aplicación en la cual se puedan ver distintas razas de perro junto con información relevante de las mismas utilizando la api externa the dog api y a partir de ella poder, entre otras cosas:
- Buscar perros
- Filtrarlos / Ordenarlos
- Agregar nuevos perros
- React
- Redux
- Express
- Sequelize - Postgres
Se desarrolló una aplicación de React/Redux que contenga las siguientes pantallas/rutas.
Pagina inicial: una landing page con
- Alguna imagen de fondo representativa al proyecto
- Botón para ingresar al home (
Ruta principal)
Ruta principal: contiene
- Input de búsqueda para encontrar razas de perros por nombre
- Área donde se verá el listado de razas de perros. Deberá mostrar su:
- Imagen
- Nombre
- Temperamento
- Peso
- Botones/Opciones para filtrar por:
- Temperamento
- Raza existente (es decir las que vienen de la API) o agregada por nosotros (creadas mediante el form)
- Botones/Opciones para ordenar tanto ascendentemente como descendentemente las razas de perro por:
- Orden alfabético
- Peso
- Paginado para ir buscando y mostrando las siguientes razas, mostrando 8 razas por página.
IMPORTANTE: Dentro de la Ruta Principal se deben mostrar tanto las razas de perros traidas desde la API como así también las de la base de datos, pero NO está permitido almacenar en la base de datos las razas de perros de la API sino que solamente se pueden guardar aquellas creadas desde el form.
Ruta de detalle de raza de perro: contiene
- Los campos mostrados en la ruta principal para cada raza (imagen, nombre y temperamento)
- Altura
- Peso
- Años de vida
Ruta de creación de raza de perro: contiene
- Un formulario controlado con JavaScript con los siguientes campos:
- Nombre
- Altura (Diferenciar entre altura mínima y máxima)
- Peso (Diferenciar entre peso mínimo y máximo)
- Años de vida
- Posibilidad de seleccionar/agregar uno o más temperamentos
- Botón/Opción para crear una nueva raza de perro
Es requisito que el formulario de creación esté validado con JavaScript y no sólo con validaciones HTML. Pueden agregar las validaciones que consideren. Por ejemplo: Que el nombre de la raza no pueda contener números o símbolos, que el peso/altura mínimo no pueda ser mayor al máximo y viceversa, etc.
El modelo de la base de datos tiene las siguientes entidades:
- Raza con las siguientes propiedades:
- ID
- Nombre
- Altura
- Peso
- Años de vida
- Temperamento con las siguientes propiedades:
- ID
- Nombre
La relación entre ambas entidades es de muchos a muchos ya que una raza de perro puede tener varios "temperamentos" en simultaneo y, a su vez, un "temperamento" puede corresponder a múltiples razas de perro distintas.
Se desarrolló un servidor en Node/Express con las siguientes rutas:
- GET /dogs:
- Obtiene un listado de las razas de perro
- Devuelve solo los datos necesarios para la ruta principal
- GET /dogs?name="...":
- Obtiene un listado de las razas de perro que contengan la palabra ingresada como query parameter
- Si no existe ninguna raza de perro muestra un mensaje adecuado
- GET /dogs/{idRaza}:
- Obtiene el detalle de una raza de perro en particular
- Trae solo los datos pedidos en la ruta de detalle de raza de perro
- Incluye los temperamentos asociados
- POST /dogs:
- Recibe los datos recolectados desde el formulario controlado de la ruta de creación de raza de perro por body
- Crea una raza de perro en la base de datos relacionada con sus temperamentos
- GET /temperaments:
- Obtiene todos los temperamentos posibles
- En una primera instancia se obtienen desde la API externa y se los guarda en la propia base de datos y luego ya se utilizan desde allí