Project Document

Your final outcome:

• You will build your first dynamic web application combining all of the CS tools you learned so far!

Project Plan:

In this challenge, a [Topic] of your choosing has approached you looking for a new web application!
The company can be an organization you like, a restaurant you visit frequently, or any other one on your mind.

The company asks for:

• 3 main pages: A signup, a signin & a home page.
• The form should be linked to Firebase.
• The web application should run on Flask.

Official Requirements:

Final Outcome:

• At least 3 HTML pages - Focus on User Interactivity/Friendliness
• Uses Flask (Routing & Forms)
• Authentication (Signin & Signup)
• Databases implemented. (2 functions of CRUD)

Bonus:

• API

Should be submitted with:

• Storyboard & Wireframe (if any)

Why should you care?

You learned about Front-end (HTML, CSS and JS) and Back-end (Python, Flask and Firebase). Now it’s time to put all of this knowledge combined together to the test!
The best way to practice and solidify all of these new concept in programming is to actually implement it, so this project gives you a chance to make practical use of what you’ve learned. This is your chance to show us what you’re passionate about using CS only, you can show off your skills and still focus on your website’s topic using your creativity!

Brainstorming:

1. Brainstorm a topic the website revolves around and decide on the company/service you are building a web application for.

• Can be on paper & pen or a tool of your choice. Make sure to save your documentation somewhere safe as you are encouraged to submit it!

Hypothetical Projects You could do! (To get your brain running)

• A web application for a restaurant that has a reviews form and a signin/signup to review, where the customers can rate the restaurant after visiting it.
• A web application for an organization that has a login/signup page for the organization employees/members.
• A web application for a cleaning service that has a contact form so the users can send requests easily to the cleaning crew.

Project Samples: (Also to get your brain running)

• Recipes Website
• One Direction Fans

Storyboarding & Wireframing:

1. Draw the storyboards and wireframe of your different pages!

• Can be on paper & pen or a wireframing tool of your choice (such as NinjaMock).
• For getting a color scheme, here's a useful website
• Wireframe example:

• Storyboard example:

Building/Workflow:

1. Brainstorming
2. Writing down your plan, Storyboarding & Wireframing (optional) + Choosing a color scheme (optional)
3. Implementation (Coding + building everything together)

Don't forget the CS team is always here for you! To help push and support your work and creativity. Don't hesitate to approach anyone on the team for anything on your mind!