teaching machines

CS 268: Project 2 – React App

April 14, 2020 by . Filed under specifications, spring-2020, webdev.

In the second project of this course, you will create a web app that consumes a web service using several tools from the Node.js ecosystem, including React, Redux, and Express.

Expectations

Your app must meet the following expectations:

  1. You will create an app that has a coherent purpose. Its content must be original and satisfy a personal creative itch.
  2. You may work with a partner or as an individual.
  3. Your app will have both a back-end data store and web service and a front-end client.
  4. You will create a front-end client using React’s functional components and hooks. (Do not use classes for making components.)
  5. The content of your client must change dynamically as the user interacts with it. (Sites with static content really should not be written with React.)
  6. You will manage state in your client using Redux.
  7. You will access your web service from your client using your own calls to fetch and not through any helper library.
  8. Your client must be free from all warnings and errors.
  9. Your front-end client must be stored in a Git repository that you have shared with your instructor. On GitHub, GitLab, and Bitbucket, share with the user twodee.
  10. Your front-end client must be deployed through a custom domain name through HTTPS over port 443. You can serve it with Apache much like you serve out project 1 and your blog. But do not include the Listen 443 line in your virtual host configuration file. This line is already included in another configuration file, and including it twice will result in an error.
  11. If visitors access your client through port 80, they must be redirected automatically to port 443.
  12. Your app will store its data long-term in a database—preferably MySQL, but you may petition for something else.
  13. You will indicate asynchronous activity to the user via the GUI. For example, while a fetch executes, you will show a progress wheel.
  14. You will provide an Express-based web service for interacting with the database. The service must only be directly accessible from your droplet, and not from outside. Use ufw to block all ports but the ones you need for SSH and your allowed web servers.
  15. Your web service must be started using a process manager like pm2 so that it stays running.
  16. You will create an Nginx server that allows global, encrypted access to your web service.
  17. Your back-end must be stored in a separate Git repository that you have shared with your instructor. On GitHub, GitLab, and Bitbucket, share with the user twodee.

Report

By the due date, share in a direct message on Slack a brief but itemized breakdown of how you believe you have met the expectations listed above.