commitra / commitra/react-verse

Recipes.jsx : Nutrition Estimation Integration (Open API)

Abierto
#81 2 comentarios 0 reacciones 1 asignado Reclamado por @HKSahanTharaka Ver en GitHub
good first commit hacktoberfest
Lenguaje dominante
JavaScript
Estrellas
8
Forks
34
Métricas de merge de PR
Sin PR fusionados en 30 d

Descripción

Enhance the Recipes.jsx component by integrating a nutrition estimation API to automatically calculate and display the nutritional values (calories, protein, fat, carbs, etc.) for each recipe.
The goal is to give users quick insight into the health value of a recipe without manual entry.

Requirements:

Integrate a free/open API such as:
Edamam Nutrition Analysis API
Nutritionix API
or any other community-friendly nutrition estimation API.

Fetch nutritional information based on recipe ingredients.
Display the results under each recipe card (e.g., small table or list showing key nutrients).
Handle loading and error states gracefully.
Cache responses locally to reduce repeated API calls.

Acceptance Criteria:

Each recipe dynamically shows basic nutrition facts.
API responses are handled asynchronously with clear loading indicators.
The UI remains responsive even when API data is loading.
Works with at least 5 example recipes.

Bonus (optional):

Add a “Show More Nutrition Info” toggle to expand/collapse additional details.
Format values nicely (e.g., 200 kcal, 12g protein, etc.).

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.