Personal React Site

You are going to design and build your very own React site with a theme and content of your choosing.

This site will be a portfolio piece.

Project Requirements

1. Your site must integrate with an online API. Use the axios library to make client-side HTTP requests.
2. Here is a huge list of open APIs you can use. Some fun ones include:
   • Open Movie Database API
   • Rotten Tomatoes API
   • Weather Forecast API
   • Edmunds Vehicle API
   • Mashape API Library
   • Programmable Web API Library
3. Your site must have at least 3 views (pages) using React Router.
4. Your site must use Context, render-props, or HOC's to help cross cut some of the concerns in React like sharing state across the app and writing DRY ("Don't Reapeat Yourself") code.
5. Remember to use lifecycle methods like componentDidMount for managing HTTP requests.
6. Your site must be responsive. Can use any method to accomplish this you want.

One of the big challenges in accessing APIs is getting around the browser's "Same Origin Policy". Many of the APIs above require you to make requests from a server instead of the client. V School has built a small, simple request forwarder to help make this process easier. It may not work in all cases, and should only be used if you know your API of choice doesn't allow frontend requests.

Check out the documentation for the request forwarder here.

Proposal

You must submit a proposal and have it passed by an instructor. This proposal is meant to help focus and scale your idea into a realistic MVP, or minimum viable product, within a reasonable time frame.

Your proposal must contain the following:

1. Paragraph describing your app idea. What are you building? Who is it for?

2. An easily describable MVP. Remember you have a limited amount of time to develop this project. What is the minimum you can get done on this project to meet the requirements and get a product in someone's hand?

3. User Stories. What is a user going to do when they go to your site from the time they hit the landing page? What features do they need and which are optional?

4. Wireframe. What is each page going to look like? What will be the layout, color scheme, etc? Check out wireframe.cc for a simple and free wireframing tool.

5. Mind Map. What is the folder structure of your frontend app going to look like? Make a diagram representing its component hierarchy.

Once you have these items, you need to meet with your instructor to pass off your proposal before you can start coding.

Have fun!