<!--  -->

<!-- # Project #2: Full-stack Web Application (PTWD MIA) -->

_Find below the general guidelines. Please check in with your instructor regarding any additional requirements. Good luck!_

## Introduction

Now that you are more familiar with the backend, you can make a complete Web application for your 2nd project.
You’ll be building an **Express** app, which means you’ll learn/practice about what it takes to make a functional application from the ground up yourself.

We suggest that you **do this project in pairs**, but please check in with your teacher.

We hope you’ll exercise creativity on this project, sketch some wireframes before you start, and write user stories to define what your users will want to do with the app.

Make sure you have time to run these ideas by your teacher and TAS to get their feedback before you dive too deep into code!

Remember to keep things small and focus on mastering the fundamentals – scope creep/feature creep is the biggest pitfall for any project!

Here are some examples of past projects:

- [Attract-Athletic](https://attract-active.herokuapp.com/)
- [Quick-Fit](https://quickfit-1.herokuapp.com/)
- [Divex](http://divex.herokuapp.com/)

## Schedule

## Full-time:

- Stand ups\*
- Coding Kata
- Project development

## Part-time:

- **Week Nights**

- Stand ups\*
- Project development

- **Saturdays**
- Stand ups\*
- Coding Kata
- Project development
<br>

*\*Every day, during project weeks, you will start with this activity. Take a minute to update your colleagues with your progress:*
- *what did you do so far*,
- *do you feel on the track, behind or ahead*,
- *what's your plan for today*,
- *do you think you'll have any blockers*.

<br />

### For both (FT & PT): Two days before presentation day

_Presentation Practice_: About You & Your Project + Demo. Refer to the Presentation Section to see how to create your presentation. <br />

### Presentation day

Finally, it's time for your presentation. You will present your projects to the staff and other students. Remember to dress at least one degree nicer than normal. Check out the Demo Tips.

<br />

## Technical Requirements

Your app must:

1. **Use Express** as a foundation.
2. **Use Mongoose** for models and database communication.
3. **Have 3 models _or more_**.
One of the models will certainly be the "User" model and the other ones should represent the main functionality of your app.<!-- Don't force it if having more than two models doesn't make sense. -->
4. **Have validation on the models** with feedback for users if their submission is invalid.
5. Have full authorization and authentication in place:
- **Include sign up, log in & log out functionality** with encrypted passwords (and/or social logins)
- Have **protected routes** (some routes shouldn't be accessed unless user is logged; the same way, if user is logged in signup and login routes shouldn't be available for this user to access).
7. **Implement all CRUD actions** on models other than users. You should have create, read, update and delete features even if they aren't all for the same model.
8. Use at least one API (the GET functionality is enough). The API must be free of charge. Here is the list of public (free) APIs: **[https://github.com/public-apis/public-apis](https://github.com/public-apis/public-apis)**.
9. Have a **repo on GitHub**.
10. Have at least **1 commit per day** during project development weeks.
11. **Be deployed online** using Heroku so that anybody could use your app.

Responsive design **is not a requirement, but it's nice to have**.

## Deliverables

- A **working full-stack application, built by you** deployed on Heroku.
- The URL of the **GitHub repository** for your app.
- The URL of the **live app on the Internet**.
- The URL of the **slides for your app's presentation**.
- You must present your app during Project #2 final presentations (last day of Project #2 time).

<!-- Wireframes **are not a deliverable**. <br>
User stories **are not a deliverable**. -->

## Presentations

Project #2 presentation will focus mostly on your project. You **won't** have to talk much about yourselves or your background. You should still **introduce yourselves briefly**.

### Format

- Talking with Slides: **3 minutes**
- Demo: **2 minutes**
- Total: **5 minutes**

### Attire

- Dress nicely for this and all final project presentations (last day of each project's time).
- Dress at least **one degree more elegantly** than you usually dress for class.
- _Examples_:
- If you wear t-shirts every day, wear a button-down shirt.
- If you wear jeans every day, wear some slacks.
- If you wear sneakers every day, wear nicer shoes.

### Slide Applications

- All presentations will be done **from a staff member's computer**, so **your slides need to be online**.
- PowerPoint files, Keynote files or files of any kind **will not be accepted**.
- Suggested online slide applications:
- [Slides](https://slides.com/)
- [Prezi](https://prezi.com/)
- [Google Slides](https://www.google.com/slides/about/)

### Presentation Structure

1. **Title Slide** (1 slide): your project's name & your name
2. **Project Elevator Pitch** (1-2 slides):
- What is your project?
- How does it work?
- Why did you choose it?
3. **Technical Challenge** (1-2 slides):
- What was **the most important** technical challenge you faced?
- How did you overcome that challenge?
4. **Big Mistake** (1-2 slides):
- What was **the biggest** mistake you made during this project?
- What did you learn from it?
5. **Demo Slide** (1 slide): literally says "DEMO"
with **a link** to your project so you can open it easily
6. **Closing Slide** (1 slide): your project's name, your name & a _"Thank You"_
7. **Total**: 6-9 slides

#### Presentation Structure Notes

- **Don't** include a slide just for the technologies.
- **Don't** include any code in your slides. Nobody will read it.
- **Don't** include a slide for GitHub graphs.
- **Don't** go into detail about how the app works. Your demo is where you want to do that.
- If you think that deviating from the structure improves your presentation, feel free to do so. This suggested structure is mostly for people who don't know what to do.

### Demo Tips

1. Plan what you are going to demo and **practice it on the live site**. That way you won't be surprised if something breaks on the live version.
2. **Deploy early** so you can squash bugs. There are _always_ bugs on the live site at first.
3. Add **link to your live project** to your DEMO slide so you can start it smoothly.
4. Your app's colors and sizing **might look different on the projector**. If you think it might be a problem, ask to test it beforehand.
5. If your app is on Heroku, **refresh it before you present**. Otherwise, there will be a delay on the initial load.

## Project Feedback and Evaluation

- **Technical Requirements**: Did you deliver a project that met all the technical requirements?
- **Creativity**: Did you add a personal spin or creative element into your project?
- **Code Quality**: Did you follow code style guidance and best practices?
- **Deployment**: Did you deploy your application to a public url using Heroku/some other platform?
- **Total**: Your instructors will give you a total score on your project between: <br /><br />
| Score | Expectations |
| ----- | ------------------------------------------------------- |
| **0** | _Didn't meet expectations_ |
| **1** | _Met expectations, good job!_ |
| **2** | _Exceeded expectations, you magnificent creature, you!_ |

<br>

You should use the feedback to focus on what needs to be improved for the next project.

<br>

**Good luck!** :heart: