Your will be creating a front end application using React.

This is exciting! It's a lot, but we have faith in you! You've learned the necessary tools over the past few weeks to be able build what you need, and you get to decide what you do with it. And you get to be creative in choosing what sort of application you want to build!

You will be working individually for this project, and you'll be designing the app yourself, but we'll be guiding you along the process and helping as you go. Show us what you've got! 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 instructors 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!

By the time you submit this project, you will have covered new ground in, and reviewed, many of the big themes of the course so far:

• Command Line: Practice interacting with the computer and navigating the filesystem from the command line.
• Source Control: Manage and interact with a git repository to store changes to code.
• Programming Fundamentals: Work with objects, constructors, events, while learning how to strategically solve problems and resolve errors.
• Web Fundamentals: Learn how communication happens over the internet, and how to structure, style, and animate documents within a browser. Also learn how to respond to actions your users take and the data they input into the browser.
• Browser Applications: Dive into CSS, and figure out how to use libraries and frameworks to get lots of style and functionality for free.
• Deployment: Host a web application in a managed hosting environment.
• Responsive Web Design: Making web applications that respond to device size.
• AJAX: Using Axios to make asynchronous javascript calls.
• APIs: Communicating to an API using Axios to fetch data.
• React: A front end framework for building modern web applications.

• Build a web application using create-react-app. Must be your own work.
• Use React framework to build your application with at least
  • 3 components
  • 4 props
  • 2 state properties
  • 2 setState
  • 2 routes
  • 1 API call with Axios and display the data for the user. Find an API here
• Craft a README.md file that explains your app to the world. README Template

Projects are due Thursday, 7/11 at 9am!

Submissions will be submitted by posting into slack

• a link to your deployed application
• a link to your github repository

2 minute demo of your application

• Show us the functionality!

5 minute presentation

• What is the application about?
• What are the user stories for your application?
• What API did you choose to use?
• Demo of the application
• Walk through a piece of code
• What was the most difficult part of the project?
• What was your favourite part of your project?
• What would you like to add next?

DO NOT attempt stretch goals until all MVP requirements have been met!

• Use more than 1 API
• Save data to localstorage or firebase api (docs) with React (tutorial)
• Use a React component library like Ant Design, Bootstrap React, or Material UI
• Use a CSS library like Bootstrap (tutorial)
• Add User Sign Up, Sign In, and Sign Out with Firebase and React Authentication (tutorial), alternative tutorial here (can be very challenging)

• Begin with the end in mind. Know where you want to go by planning with wireframes & user stories, so you don't waste time building things you don't need
• Don’t hesitate to write throwaway code to solve short term problems
• Read the docs for whatever technologies you use. Most of the time, there is a tutorial that you can follow, but not always, and learning to read documentation is crucial to your success as a developer
• Commit early, commit often. Don’t be afraid to break something because you can always go back in time to a previous version.
• User stories define what a specific type of user wants to accomplish with your application. It's tempting to just make them to-do lists for what needs to get done, but if you keep them small & focused on what a user cares about from their perspective, it'll help you know what to build
• Write pseudocode before you write actual code. Thinking through the logic of something helps.

• React
• DevDocs
• GitHub Pages React (for hosting your game)
• GitHub Markdown Tutorial (for working with Markdown)
• Example React Projects

We will be dropping a help thread on slack everyday during the project week, drop your favorite emoji 🐱 🍩 inside the thread so we can mark on your name to assist you. Remember! First comes first served!