Image Gallery

Click on an image to read more about it.

Features of the Backend

The backend is a REST API written in JavaScript (using the Node.js runtime environment) and ExpressJS is used for webserver functionality. The backend is organized into models, routes, controllers, and services. The models and database interaction is done through Mongoose, which connects to a MongoDB Atlas database in the cloud. Email functionality is achieved through Sendgrid, JsonWebToken is used for authorization, and node-fetch is used to simplify some API calls.

Features of the Frontend

The frontend is written in React, with some help from the MUI library to implement common UI components like dialogs, accordions, and icon buttons. Axios is also used to simplify API calls to the backend. The frontend is served via GitHub pages.

The quotes come from the MongoDB Atlas cloud database, which is populated by users who submit quotes to the website. The background image comes from NASA's Astronomy Picture of the Day API.

Security

You may have noticed that users do not use passwords! This is possible through JSON Web Tokens (JWTs) and email verification. When a user attempts to log in, they only enter their email. A verification code is sent to that email and the user needs to enter this code to log in. Once they enter the correct code, an authentication and a refresh token are sent to the user to authorize them for further API calls.

The authentication token lasts for a few minutes and the refresh token lasts for about a month. When the authentication token expires, the refresh token is sent to the API to make a new one. When the refresh token expires, the user must log in again. The use of tokens is hidden to the user; sending and refreshing tokens is handled by the code in the frontend.

×

TEST