/tiny-planner

A tiny project for front end recruiting.

Primary LanguageTypeScript

Surely Meal Planner

Instructions

Build a React app (using Typescript) using this template project that accomplishes the following:

  1. Let's you search for Recipes by diet, certain health restrictions, meal type, dish type, cuisine type, and any arbitrary query text that appears in the Recipe (i.e. query=chicken) using the Edamam Recipe Search API with the key that was provided to you.
  2. Let's you select Recipes returned and add it to your next 7 day Meal Plan.
  3. Let's you view a final summary of your Meal Plan for the week, showing what to eat each meal of each day of the week, and provides you with the recipes, their instructions, details, etc. grouped by meal type (i.e. Breakfast, Lunch, Dinner, Snack).

While we'll be judging this on functionality above all else, feel free to showcase your skills and diligence -- from documentation, testing, design, architecture, and more.

CSS

Note that the current site uses skeleton.css. Feel free to replace this if you like with anything you're more comfortable with.

APIs

Use the api key and app id that sent to you to populate recipes. If for whatever reason this isn't working, you'll have to sign up for the Edamam API and use your own app id and key.

Note that the test keys given to you are limited and do not allow you to filter across dish and cuisine type. Feel free to handle those items as you like (either show errors from the API properly, ignore those filters, etc).

Example curl

This example curl will use the API to search for alcohol free recipes between 591-722 calories, limiting to three results, which contain the word "chicken" in them.

curl "https://api.edamam.com/search?q=chicken&app_id=${YOUR_APP_ID}&app_key=${YOUR_APP_KEY}&from=0&to=3&calories=591-722&health=alcohol-free"

Domain Model

Feel free to use this domain model as a starting point for the application.

Recipe

{ 
    label: "recipe title",
    image: "image url",
    source: "source site identifier",
    url: "original recipe url",
    yield: 100, //integer, number of servings
    calories: 835.25, //float, total energy, kcal
    totalWeight: 25.2 //float, total weight, g
    ingredients: Ingredient[] //Ingredient[], array of Ingredient types
    totalNutrients: NutrientInfo[],//NutrientInfo[], nutrients for entire recipe
    totalDaily: NutrientInfo[], //NutrientInfo[], % daily value for entire recipe 
    dietLabels: enum[], //diet labels
    healthLabels: enum[], //health labels 
}

Ingredient

{ 
    foodId: "food identifier string",
    quantity: 2.5, //float, quantity of specified measure
    measure: Measure, //Measure
    weight: 2.5, //float, total weight, g
    food: Food //Food
}

NutrientInfo

{ 
    uri: "string identifier",
    label: "display label",
    quantity: 2.5, //float quantity of specified units
    unit: "unit"
}

Measure

{ 
    uri: "string identifier",
    label: "common name",
}

Food

{ 
    foodId: "string food identifier",
    label: "common name",
}

Diet Labels

[ "balanced", "high-protein", "high-fiber", "low-fat", "low-carb", "low-sodium" ]

Health Labels

[ "vegan", "vegetarian", "paleo", "dairy-free", "gluten-free", "wheat-free", "fat-free", "low-sugar", "egg-free", "peanut-free", "tree-nut-free", "soy-free", "fish-free", "shellfish-free" ]

Meal Type

["Breakfast", "Lunch", "Dinner", "Snack"]

Dish Type

["Bread",
"Cereals", "Condiments and sauces", "Drinks", "Desserts", "Main course", "Pancake", "Preps", "Preserve", "Salad", "Sandwiches", "Side dish", "Soup", "Starter", "Sweets"]

Cuisine Type

["American", "Asian", "British", "Caribbean", "Central Europe", "Chinese", "Eastern Europe", "French", "Indian", "Italian", "Japanese", "Kosher", "Mediterranean", "Mexican", "Middle Eastern", "Nordic", "South American", "South East Asian"]

Dish Type

Nutrients Codes and units

NTR Code Name Unit NTR Code Name Unit
CA Calcium mg ENERC_KCAL Energy kcal
CHOCDF Carbs g NIA Niacin (B3) mg
CHOLE Cholesterol mg P Phosphorus mg
FAMS Monounsaturated g PROCNT Protein g
FAPU Polyunsaturated g RIBF Riboflavin (B2) mg
SUGAR Sugars g SUGAR.added Sugars, added g
FAT Fat g FASAT Saturated g
FATRN Trans g TOCPHA Vitamin E mg
FE Iron mg VITA_RAE Vitamin A æg
FIBTG Fiber g VITB12 Vitamin B12 æg
FOLDFE Folate (Equivalent) æg FOLFD Folate (food) æg
K Potassium mg VITC Vitamin C mg
MG Magnesium mg VITD Vitamin D æg
NA Sodium mg VITK1 Vitamin K æg
VITB6A Vitamin B6 mg THIA Thiamin (B1) mg