Learning Objectives

With this assignment you will demonstrate:

• The ability to create and deploy a React Web Application
• The ability to fetch and display data from a public API
• Knowledge of asynchronous JavaScript

Readings and Videos

Please:

• Read docs on the React site.
• Review all applicable course notes.
• Take Eve Porcello’s class on LinkedIn Learning
• As time allows, go through The Net Ninja’s Full Modern React Tutorial.
• Read from the beginning through Chapters 3, and Chapters 5 and 6 of the Git Book.

Instructions

Submit in BrightSpace links to your CodeSandbox or Replit.

The Project

You will be creating an interactive React Web Application for fetching data from an API and displaying the data as you like. Be creative, but also work toward creating an application that would actually be useful. You can use any API that you find: it can be for music, food, restaurants, museums, weather, you name it.

Need some API ideas? Try this one, this one, or (especially) this one.

Use the techniques learned in class during our Pokémon API code along.

As in your first homework assignment, ensure your app:

• Uses a background image or gradient
• Uses grid and flex
• Is responsive: it must look good on mobile and web (narrow or wide screen)
• Has a nice “title’ (perhaps an h1 element)
• Has a fun image or two
• Is visually balanced and aesthetically pleasing: Use colors and contrast properly! Line things up! Get a designer friend of yours to critique your work
• Has a detailed README.md file, that not only explains the project (as a real README should), but also with a link to where the app is deployed.
• Is built from code (all files) that is flawlessly formatted, and that means that you not only indent and space 100% consistently, but that you are also perfectly consistent with blank-line spacing where necessary. (Prettier will help with most things.)
• Is run through an HTML and an accessibility validator