Abstract

This application allows the user to view recipes. They can search for recipes and filter through the categories. They can save and unsave the recipes they choose and also view the instructions and cost of ingredients for a recipe. This application gets information from and posts information to a connected server

Application link:

What's Cookin'

What's Cookin' API

Installation Instructions

1. Click the green < code > button.
2. Copy SSH key.
3. Open up the terminal.
4. Change into the directory you wish to clone the app into with the cd command.
5. Use the git clone git@github.com:alfonsojack/whats-cookin.git command followed by pasting the copied SSH key.
6. Change into the cloned directory with the cd command followed by the name of the directory.
7. Run npm install and wait a few seconds until its finish installing
8. Run npm start
9. Click What's Cookin API github and follow the instructions in that README.md file

Preview of App:

Context:

This was a 2 part project. A team of 3 worked on this for about 80 hours in total

Contributors:

Zen McMillan - https://github.com/zenmcmillan Jack Alfonso - https://github.com/alfonsojack/ Dan Lavery - https://github.com/wlavery22

Learning Goals

Solidify and demonstrate our understanding of:

• DRY Javascript, HTML & CSS

• GET and POST network requests

• Test driven development

• Accessibility features for different impairments

• Semantic HTML

• Modifying code based on feedback

Technologies Used

• Node Package Manager (NPM)
• Virtual Studio Code
• Github
• Git
• Webpack

Wins

Group - Achieving 100% on lighthouse accessibility audit

Zen McMillan - Understanding how webpack imports and exports work with other files and directories within a project scope.

Jack Alfonso - Interacting with APIs and adding accessibility features.

Dan Lavery - Becoming more familiar with writing tests and coordinating with larger numbers of interconnected files.

Challenges

Coordinating through schedule conflicts that came up suddenly

Zen McMillan - Understanding GET network requests was very challenging. Reading MDN documentation helped me understand how to fetch data.

Jack Alfonso - Understanding new file structures (webpack). I overcame this through a combination of trial and error and reading documentation

Dan Lavery - Understanding how to move from using a local data model to fetch calls. Reaching out for help and collaboration allowed me to overcome this.