FoodApp

BoilerPlate

En api crear un archivo llamado: .env que tenga la siguiente forma:

DB_USER=usuariodepostgres
DB_PASSWORD=passwordDePostgres
DB_HOST=localhost

Reemplazar usuariodepostgres y passwordDePostgres con tus propias credenciales para conectarte a postgres. Este archivo va ser ignorado en la subida a github, ya que contiene información sensible (las credenciales).

Adicionalmente será necesario que creen desde psql una base de datos llamada food

Enunciado

La idea general es crear una aplicación en la cual se puedan ver distintas recetas de comida junto con información relevante de las mismas utilizando la api externa spoonacular y a partir de ella poder, entre otras cosas:

• Buscar recetas
• Filtrarlos / Ordenarlos
• Crear nuevas recetas propias

Tecnologías usadas

• React
• Redux
• Express
• Sequelize - Postgres

Frontend

Se debe desarrollar una aplicación de React/Redux que contenga las siguientes pantallas/rutas.

Pagina inicial: deben armar una landing page con

• Alguna imagen de fondo representativa al proyecto
• Botón para ingresar al home (Ruta principal)

Ruta principal:

• Input de búsqueda para encontrar recetas por nombre
• Área donde se verá el listado de recetas. Deberá mostrar su:
  • Imagen
  • Nombre
  • Tipo de dieta (vegetariano, vegano, apto celíaco, etc)
• Botones/Opciones para filtrar por por tipo de dieta
• Botones/Opciones para ordenar tanto ascendentemente como descendentemente las recetas por orden alfabético y por health score (nivel de comida saludable).
• Paginado para ir buscando y mostrando las siguientes recetas, 9 recetas por pagina, mostrando las primeros 9 en la primer pagina.

IMPORTANTE: Dentro de la Ruta Principal se deben mostrar tanto las recetas traidas desde la API como así también las de la base de datos. Debido a que en la API existen alrededor de 5 mil recetas, por cuestiones de performance pueden tomar la simplificación de obtener y paginar las primeras 100.

Ruta de detalle de receta:

• Los campos mostrados en la ruta principal para cada receta (imagen, nombre, tipo de plato y tipo de dieta)
• Resumen del plato
• Nivel de "comida saludable" (health score)
• Paso a paso

Ruta de creación de recetas:

• Un formulario controlado con JavaScript con los siguientes campos:
  • Nombre
  • Resumen del plato
  • Nivel de "comida saludable" (health score)
  • Paso a paso
• Posibilidad de seleccionar/agregar uno o más tipos de dietas
• Botón/Opción para crear una nueva receta

Backend

Se debe desarrollar un servidor en Node/Express con las siguientes rutas:

IMPORTANTE: No está permitido utilizar los filtrados, ordenamientos y paginados brindados por la API externa, todas estas funcionalidades tienen que implementarlas ustedes.

• GET /recipes?name="...":
  • Obtener un listado de las recetas que contengan la palabra ingresada como query parameter
  • Si no existe ninguna receta mostrar un mensaje adecuado
• GET /recipes/{idReceta}:
  • Obtener el detalle de una receta en particular
  • Debe traer solo los datos pedidos en la ruta de detalle de receta
  • Incluir los tipos de dieta asociados
• POST /recipes:
  • Recibe los datos recolectados desde el formulario controlado de la ruta de creación de recetas por body
  • Crea una receta en la base de datos relacionada con sus tipos de dietas.
• GET /diets:
  • Obtener todos los tipos de dieta posibles
  • En una primera instancia, cuando no exista ninguno, deberán precargar la base de datos con los tipos de datos indicados por spoonacular acá