Welcome to YourRecipes.com 👋

Objetivos del Proyecto

• 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.

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

Únicos Endpoints/Flags que pueden utilizar

• GET https://api.spoonacular.com/recipes/complexSearch
  • Para obtener mayor información sobre las recetas, como por ejemplo el tipo de dieta deben agregar el flag &addRecipeInformation=true a este endpoint
  • Para los tipos de dieta deben tener en cuenta las propiedades vegetarian, vegan, glutenFree por un lado y también analizar las que se incluyan dentro de la propiedad diets
• GET https://api.spoonacular.com/recipes/{id}/information

Requerimientos mínimos

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: debe contener

• 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 puntuación
• 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: debe contener

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

Ruta de creación de recetas: debe contener

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

Base de datos

El modelo de la base de datos deberá tener las siguientes entidades (Aquellas propiedades marcadas con asterisco deben ser obligatorias):

• Receta con las siguientes propiedades:
  • ID: *
  • Nombre *
  • Resumen del plato *
  • Puntuación
  • Nivel de "comida saludable"
  • Paso a paso
• Tipo de dieta con las siguientes propiedades:
  • ID
  • Nombre

La relación entre ambas entidades debe ser de muchos a muchos ya que una receta puede ser parte de varios tipos de dieta en simultaneo y, a su vez, un tipo de dieta puede contener múltiples recetas distintas. Un ejemplo tomado de la API sería el Strawberry Mango Green Tea Limeade que es vegetariano, vegano y apto para celíacos, todo al mismo tiempo. Pero a su vez existen otras recetas para vegetarianos.

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
• GET /types:
  • 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á
• POST /recipe:
  • 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

Testing

• Al menos tener un componente del frontend con sus tests respectivos
• Al menos tener una ruta del backend con sus tests respectivos
• Al menos tener un modelo de la base de datos con sus tests respectivos

Show your support

Give a ⭐️ if this project liked you!

---