Laying out the groundwork

[counselorbot[bot]]

Final Project Step 2 ⬤⬤◯◯◯◯ | 🕐 Estimated completion: 30 minutes

Laying out the groundwork

✅ Task:

• [ ] Make sure you're on the final-project branch
• [ ] Create a flowchart that demonstrates how different components in your project interact with each other
  • Create a new file on figma.com or whimsical.com called "Serverless Camp Project"
  • Include any Azure Functions and APIs you plan on using
• [ ] 🚀 Upload the flowchart as a jpg/png file in the "project" folder
• [ ] 🚀 Commit your changes to the final-project branch, make a pull request, and merge it

Mapping it out

To get started with building, you will first need to create a flowchart showing the flow of information and components you will include to make there project work. Nothing has to be finalized, but planning it out allows you to organize your ideas and thought processes.

Purpose of Programming Flowcharts

• Plan before the development phase - this helps you save a lot of hours of work
• Document your project and communicate how it works to others (this is really valuable when someone else is helping you debug your code)
• Prevent major technical issues with your code before you event start
• Ensure that you are more effectively using all the technologies available to you
• You will need to refer back to the flowchart while developing to review your work and sometimes come up with new ideas

Converting the checklist into a flowchart

1. Create a shape for each of the components from your checklist and label them inside their designated shape
2. Draw lines on all of the technologies that interact with each other
3. Near each line, use the previous bullet points you wrote to describe the relationship between the technologies starting with action verbs (e.g. between JS code/front-end --> Azure Function "Sends an HTTP Post Request with uploaded image)
4. Use arrow heads to show the direction in which one technology is impacting another