Recipe Box - FCC Challenge - Part 1
Today I begin with the Recipe Box challenge. It will be great for learning about local storage and user interface.
These are the user stories:
https://www.freecodecamp.org/challenges/build-a-recipe-box
- I can create recipes that have names and ingredients.
- I can see an index view where the names of all the recipes are visible.
- I can click into any of those recipes to view it.
- I can edit these recipes.
- I can delete these recipes.
- All new recipes I add are saved in my browser’s local storage. If I refresh the page, these recipes will still be there.
First thoughts
- Leave local storage, style, editing and deleting a recipe for later.
- It seems that the demo page used bootstrap.
- I am interested in getting that effect of clicking the name of the recipe and show the ingredients.
- Start with an existing example recipe like {name: “Cookies”, ingredients: “Flour, butter, sugar, vanilla, baking powder, eggs, milk”}.
- Divide the page into a hierarchy of components.
Future readings
- Web Storage API
- HTML5 - Storage