Assignment 6

If you submit the assignment by Friday 10/18 at 5pm, you can get up to 10% extra credit. That is, if you get 90/100, you will get 9% extra credit for a total score of 99/100. If you get 100/100, you will get 10% extra credit for a total score of 110/100.

Requirements

Build the following application using React and React Router: https://pokemon-react-router.surge.sh. This application uses the Pokemon API.

  1. Your application must behave exactly the same as the example and show the same data.
  2. Your application must have the same client-side routes.
  3. Feel free to style it however you wish. The example uses Bootstrap.
  4. When you deploy your assignment to Surge, refreshing on a Pokemon details page should not result in an error. Be sure to read Deploying React apps made with Create React App to Surge.

Tips

  1. Use the Network tab in Chrome to see the AJAX calls being made. To get to the Network tab, right click on the page and select "Inspect". Then click on "Network". If you click on "Fetch/XHR", it will filter down all the requests in the Network tab to those from AJAX calls.
  2. To create a comma separated list from an array, use the join() method. For example: [1, 2, 3].join(', ') produces 1, 2, 3. This will be helpful for the Moves and Abilities sections on a Pokemon page.

Other Requirements

  1. You are not allowed to use any libraries. Your implementation should only use React, React Router, and optionally Bootstrap.
  2. Your implementation must only use the techniques, patterns, and concepts that we covered in class.
  3. Your implementation should not have any direct DOM manipulation or have any references to document or window.
  4. There shouldn't be any console warnings or errors when running locally or when deployed to Surge.

Submission

Create a video with audio using Zoom where you demo your assignment and explain where you fulfilled or did not fulfill each requirement. Put a link to this recording in the README.md file at the root of your project. Verify that the link to the recording works.

Also, deploy your project using Surge and include this link on your README.md. Verify that the link works.

Submit your code: https://classroom.github.com/a/rRDvOYH8

If you're having problems uploading to GitHub, please zip up your project and email it to the instructor and TA. Be sure to exclude the node_modules folder from your zip file. Please include the Zoom recording URL in the email. You can also zip up your project, put it in Google Drive or Dropbox, make the link sharable, and email that link to us.

Points will be deducted for the following:

  1. Surge link is missing or doesn't work
  2. Zoom link is missing or doesn't work
  3. You push up node_modules to GitHub or include node_modules in your zip file if you submit it via email

You will get a 0 on the assignment if:

  1. Code isn't pushed up to GitHub
  2. Code is submitted after the deadline