Homework 6: Connecting to a Backend

Assigned: 11/4/2021; Due 11/16/2021 at 3:05pm ET


In this assignment, you will be connecting your existing website to at least 2 different remote sources - the Google "Firebase" cloud database, and the Unsplash web service for downloading pictures, and then you will modify your shopping cart to support T-shirts using a picture. You will use the cloud database to allow users to login with their Google credentials, and to store their shopping cart, so it will persist between sessions, and also so different people can have different shopping carts. You will use the Unsplash web service to support adding a picture to a design (note: the free "demo" level only allows 50 queries per hour). For extra credit, you can also put your custom design from the editor onto a T-shirt, and be able to add that to the cart as well. These will be added to the version of your website from homeworks 4 and 5 that uses React for both the eCommerce part and the drawing editor part (with undo).

The user interface for homework 6 adds a way to log in and log out using Google credentials, and a screen to search for a particular image and put it on a t-shirt.

As with previous homeworks, you are allowed to use certain libraries for homework 6. You can obviously use all the ones from previous homeworks, plus the libraries that support Firebase and Unsplash. You can use the built-in functions for interfacing with the network, like fetch. You might find the lodash.com library useful for sorting the array of cart items from the database.

However, you may not use libraries that implement saving a shopping cart directly, or saving a cart to a database, etc. If you have another package you would like to use, please ask on Piazza.