Merge pull request #41 from florinpop17/feature/add-recipe-app

Feature: Add Recipe app specification

Projects/Recipe-App.md

@@ -0,0 +1,51 @@
+# Recipe
+
+**Tier:** 1-Beginner
+
+You might not have realized this, but recipe's are nothing more than culinary
+algorithms. Like programs, recipe's are a series of imperative steps which,
+if followed correctly, result in a tasty dish.
+
+The objective of the Recipe app is to help the user manage recipes in a way
+that will make them easy to follow. 
+
+### Constraints
+
+- For the inital version of this app the recipe data may be encoded as a
+JSON file. After implementing the initial version of this app you may
+expand on this to maintain recipes in a file or database.
+
+## User Stories
+
+-   [ ] User can see a list of recipe titles
+-   [ ] User can click a recipe title to display a recipe card containing the
+recipe title, meal type (breakfast, lunch, supper, or snack), number of people
+it serves, its difficulty level (beginner, intermediate, advanced), the list
+of ingredients (including their amounts), and the preparation steps.
+-   [ ] User click a new recipe title to replace the current card with a new
+recipe.
+
+## Bonus features
+
+-   [ ] User can see a photo showing what the item looks like after it has
+been prepared.
+-   [ ] User can search for a recipe not in the list of recipe titles by
+entering the meal name into a search box and clicking a 'Search' button. Any
+open source recipe API may be used as the source for recipes (see The MealDB
+below).
+-   [ ] User can see a list of recipes matching the search terms
+-   [ ] User can click the name of the recipe to display its recipe card.
+-   [ ] User can see a warning message if no matching recipe was found.
+-   [ ] User can click a 'Save' button on the cards for recipes located through
+the API to save a copy to this apps recipe file or database.
+
+## Useful links and resources
+
+- [Using Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch)
+- [Axios](https://www.npmjs.com/package/axios)
+- [The MealDB API](https://www.themealdb.com/api.php) 
+
+## Example projects
+
+- [Recipe Box - a Free Code Camp Project (FCC)](https://codepen.io/eddyerburgh/pen/xVeJvB)
+- [React Recipe Box](https://codepen.io/inkblotty/pen/oxWRme)

README.md

@@ -48,12 +48,13 @@ required to complete them.
 | [CSV2JSON App](./Projects/CSV2JSON-App.md)                             | CSV to JSON converter                                     | 1-Beginner |
 | [Flip Image](./Projects/Flip-Image-App.md)                             | Change the orientation of images across two axes          | 1-Beginner |
 | [JSON2CSV App](./Projects/JSON2CSV-App.md)                             | JSON to CSV converter                                     | 1-Beginner |
-| [Lorem Ipsum Generator](./Projects/Lorem-Ipsum-Generator.md)           | Generate lorem ipsum placeholder text                     | 1-Beginner |
+| [Lorem Ipsum Generator](./Projects/Lorem-Ipsum-Generator.md)           | Generate lorem ipsum placeholder text                   | 1-Beginner |
 | [Notes App](./Projects/Notes-App.md)                                   | Create and online note pad                                | 1-Beginner |
 | [Pomodoro Clock](./Projects/Pomodoro-Clock.md)                         | Task timer to aid personal productivity                   | 1-Beginner |
 | [:star2: Product Landing Page](./Projects/Product-Landing-Page.md)     | Showcase product details for possible buyers              | 1-Beginner |
 | [Quiz App](./Projects/Quiz-App.md)                                     | Test your knowledge by answering questions                | 1-Beginner |
-| [Roman to Decimal Converter](./Projects/Roman-to-Decimal-Converter.md) | Convert Roman to Decimal numbers                          | 1-Beginner |
+| [🌟Recipe App](./Projects/Recipe-App.md)                               | Recipe                                                    | 1-Beginner |
+| [Roman to Decimal Converter](./Projects/Roman-to-Decimal-Converter.md) | Convert Roman to Decimal numbers                    | 1-Beginner |
 | [Slider Design](./Projects/Slider-Design.md)                           | Display images using a slider control                     | 1-Beginner |
 | [TrueOrFalse](./Projects/True-or-False-App.md)                         | Identify the result of a conditional comparison           | 1-Beginner |
 | [Wind Chill](./Projects/Windchill-App.md)                              | Calculate the windchill factor from an actual temperature | 1-Beginner |