nateayye/meal-mule

Meal Mule

Description

Admittedly, many applications exist that track meals, diets, and provide recipes, however most do not have mules. Whilst mules may be a marketing shtick, shitcks garner attention, but are also useful. To wit: mules carry what are essential. We all have favorite meals, and avidly repeat them for lack of creativity, but once and awhile a new culinary exoticism is introduced that becomes a new go-to in your kitchen. This is where Meal Mule comes in. We analyze your diet, BMI, and preferance for ingredients and calorie intake, then suggest meals/recipes tailered to your preferences. You can easily "pack your mule" with these new meals/recipes and add it to your culinary and dietary journey, without the burden of research and planning.

Developing Meal Mule challenged us to use unfamiliar applications, such as Adobe In-Design, Miro, and unique APIs, all whilst corralling the team toward a common goal. Planning, we found out, save a lot of development time. When multiple poeple work simulatenously on discrete portions of the same application, the potential for accidentally deviating conceptually from the common goal multiplies per person involves, so communication and regular team meetings are essential.

Installation

Installation is as easy as calling a mule, clone the repo, and open the files in you preferred browser, then launch the site live.

Usage

1.) When first using Meal Mule, You will first have to create and name a mule. Your mule acts as a pack for the meals of the week. Note: at any point you can delete your mule(s).

2.) Once you have named your mule, you will need to select recipes from the recipe page, then "add them to your mule". You may select recipes based upone set criteria, i.e., BMI, Caroies, etc. The recipes page also has pre-packed recipe suggestions if you are want to try them.

3.) Once you have your mule packed, youn can saunter over to "Meal Details" to get step-by-step instructions for how to cook your meals.

4.) If you would like to know more about the development team, visit our About Us page and get to know the mulers.

Provide instructions and examples for use. Include screenshots as needed.

Credits

Collaborators: Nathan Cuevas: Github Profile Diana L: Github Profile Angel Garcia: Github Profile Aaron Styza: Github Profile

License

Refer to the repo file for licensing information.

Features

Users of Meal Mule can dynamically create weekly meal schedules (mules, packed with meals and recipes) according to their dietary restrictions and caloric requirements. Meal Mule in turn recommends popular meals that you may enjoy and add to your meal. We inclluded a meal details feature that gives step-by-step instructions on how to cook all your meals, because, most importantly, impress your friends with your culinary acumen.

meal-mule's Issues

Mule Meals Page

Meals Page

The Layout

It should have a container with a

element in it so that you can grab it with JavaScript(weather that be an id or class etc.)

Then Within the JavaScript file in a document.addEventListener('DOMContentLoaded',() => {}) or w/ jQuery $(() => {}) And within this function you grab the localStorage(key = 'meals' or 'mules' etc.) and which should either be empty if they haven't made a mule or if they have made a mule it should have and array of data shaped somewhat like this:

Data Example

[
 {
  "name": "Spicy Week",
  "meals": [
  "665843",
  "548323",
  "493454"
  ]
 },
 {
  "name": "Potato Week",
  "meals": [
  "293425",
  "010923",
  "786709"
  ]
 }
]

JavaScript Example

So let's say they have data then you are going to want to loop over the array of weeks. and display each week with an element and within each element you have a function that loops over the array of meals within the week and that grabs the ID of the meal and fetches the data and creates the card with the data.

Either at the top of the page or the bottom of the list of weeks have a button for adding a new Mule.
that just displays a popup asking for the name of the mule and when the user clicks confirm on the popup with the name it is going to add the name to a new week object that we create and then add it to the localStorage next to the old data. Then probably reload the page to display the new week on the page.