A simple web app to help you find something better to do

• Introduction

  Now that you are more familiar with React, you can make a complete frontend for your 2nd project.You’ll be building a React 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:

• Find a Flick

• Quali Life

• We Fork!

• Wanderlust

• IDoption

• Flow Finance

• Datify

• Pickr

• Re.Mo

• Schedule

• Full-time

• Stand ups

• Project development

• Presentation day

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

• Technical Requirements

  Your app must:

• Use React as a foundation.

• Use Axios to fire HTTP requests to an external API (server), and update the screen with the received data.

• Simulate a fake backend with** the Ironrest API. Additionally, you can use external APIs to enrich your project.**

• Have Routes for all components that should represent a single page in the screen.

• Implement a fully functioning CRUD: users are able to create something, then visualize what they created, edit it and delete it. The details, edit and delete Routes should have route parameters.

• Have a repo on GitHub.

• Have at least 1 commit per day that you worked on it.

• Be deployed online using Netlify so that anybody could use your app.

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

• Deliverables

• A working React application, built by you that runs on a server.

• A deploy of your app on Netlify.

• 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).

• 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

• Prezi

• Google Slides

• Presentation Structure

• Title Slide (1 slide): your project’s name & your name

• Project Elevator Pitch (1-2 slides):

• What is your project?

• How does it work?

• Why did you choose it?

• Technical Challenge (1-2 slides):

• What was the most important technical challenge you faced?

• How did you overcome that challenge?

• Big Mistake (1-2 slides):

• What was the biggest mistake you made during this project?

• What did you learn from it?

• Demo Slide (1 slide): literally says "DEMO"with a link to your project so you can open it easily

• Closing Slide (1 slide): your project’s name, your name & a “Thank You”

• 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

• 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.

• Deploy early so you can squash bugs. There are always bugs on the live site at first.

• Add link to your live project to your DEMO slide so you can start it smoothly.

• 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.

• If your app is on Heroku, refresh it before you present. Otherwise, there will be a delay on the initial load.