53 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
			
		
		
	
	
			53 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| ---
 | |
| id: bd7155d8c242eddfaeb5bd13
 | |
| title: Build a Recipe Box
 | |
| isRequired: false
 | |
| challengeType: 3
 | |
| forumTopicId: 302354
 | |
| ---
 | |
| 
 | |
| ## Description
 | |
| <section id='description'>
 | |
| <strong>Objective:</strong> Build a <a href='https://codepen.io' target='_blank'>CodePen.io</a> app that is functionally similar to this: <a href='https://codepen.io/freeCodeCamp/full/dNVazZ/' target='_blank'>https://codepen.io/freeCodeCamp/full/dNVazZ/</a>.
 | |
| Fulfill the below <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>user stories</a>. Use whichever libraries or APIs you need. Give it your own personal style.
 | |
| <strong>User Story:</strong> I can create recipes that have names and ingredients.
 | |
| <strong>User Story:</strong> I can see an index view where the names of all the recipes are visible.
 | |
| <strong>User Story:</strong> I can click into any of those recipes to view it.
 | |
| <strong>User Story:</strong> I can edit these recipes.
 | |
| <strong>User Story:</strong> I can delete these recipes.
 | |
| <strong>User Story:</strong> All new recipes I add are saved in my browser's local storage. If I refresh the page, these recipes will still be there.
 | |
| <strong>Hint: </strong> You should prefix your local storage keys on CodePen, i.e. <code>_username_recipes</code>
 | |
| Remember to use <a href='//github.com/FreeCodeCamp/freecodecamp/wiki/FreeCodeCamp-Get-Help' target='_blank'>Read-Search-Ask</a> if you get stuck.
 | |
| When you are finished, click the "I've completed this challenge" button and include a link to your CodePen.
 | |
| You can get feedback on your project by sharing it with your friends on Facebook.
 | |
| </section>
 | |
| 
 | |
| ## Instructions
 | |
| <section id='instructions'>
 | |
| 
 | |
| </section>
 | |
| 
 | |
| ## Tests
 | |
| <section id='tests'>
 | |
| 
 | |
| ```yml
 | |
| tests: []
 | |
| 
 | |
| ```
 | |
| 
 | |
| </section>
 | |
| 
 | |
| ## Challenge Seed
 | |
| <section id='challengeSeed'>
 | |
| 
 | |
| </section>
 | |
| 
 | |
| ## Solution
 | |
| <section id='solution'>
 | |
| 
 | |
| ```js
 | |
| // solution required
 | |
| ```
 | |
| 
 | |
| </section>
 |