Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Meal Planner 2.0

An app to help the user make meal-planning decisions. Click here to go to app


This is a side project I've been working on for my wife. Intended to help with decision-making when it comes to meal planning, and implement paperless tracking of our meals.

Note: This app is currently designed for my family's personal use only. Feel free to check it out, but currently there is no option to personalize the meals in the database!


  1. View all the meals in the database
  2. Return a meal plan. Select the number of meals you want to return (1-31) to get a list of random meals and the estimated grocery bill for the meal plan.
  3. Find new recipes. Enter a search term to search for new recipes. This feature uses a 3rd party API.

Using the App

To use the app visit the URL |

Upon loading the app, you are presented with three choices in the form of buttons.

  1. View All Meals
  2. Get Meal Plan
  3. Find New Recipes

View All Meals | Click or tap (for touchscreen) the "VIEW ALL MEALS" button to return a list of all meals currently in the database.

Get Meal Plan | Click or tap the "GET MEAL PLAN" button to return a meal plan. When you choose this option, a slider will appear allowing you to choose a number between 1 and 31. This number represents how many meals you would like to return for your meal plan. Move the slider to your desired number, and click or tap the "GET MEALS" button. The number you chose on the slider will be the quantity of random meals that is returned from the database.

Find New Recipes | Click or tap the "FIND NEW RECIPES" button to search for recipes based on keywords. This feature will search a 3rd party recipe collection (NOT THE DATABASE) for recipes based on the keywords you enter, and will display the results. You may then click on the "View Recipe" link on any one of the results to go to that recipe.

Tech Stack

  1. HTML5
  2. Sass
  3. JavaScript
  4. jQuery
  5. Vue.js
  6. Node.js
  7. Express.js
  8. MySQL


  1. Landar40 wrote the markup and styles for the first draft. He chose the original color scheme and general theme, that draft can be viewed here.