Book'd Up

A web app that allows a user to create and sort bookshelves, as well as create and join bookclubs.

Front end is developed using React (initialized using create-react-app). HTTP requests to APIs are achieved using Axios.
Back end is built using Express which communicates with a PostgreSQL database.

Google Books API is used to retrieve book information and covers.

MatchBook🔥 is a Tinder-like feature for books, where the user is presented with books one by one to skip/save depending on the genre they choose. The 3D book view is created with react-three-fiber. A cors-anywhere proxy runs alongside the Express server to allow using book cover images from Google Books API. The color-thief-react library is used to obtain the book cover's dominant color to color the 3D book's back cover and spine.

Screenshots

Home page with banner and bookclubs listed by member count

Profile page showing created/joined bookclubs and 3 bookshelves

Creating a bookclub

Using the Search feature to pick a new book for created bookclub's "Currently reading" shelf, then moving it to "Finished reading"

Joining a bookclub

Using MatchBook🔥 to skip and save books to "Want To Read" shelf

Getting Started

1. Install dependencies for React and Express server using npm install inside their respective folders
2. Start React and the server using npm start also inside each folder
3. Go to http://localhost:3000 in your browser

Dependencies

Front End

• React
• react-router-dom
• Axios
• Sass
• react-three-fiber
• color-thief-react

Back End

• Express
• pg
• cors-anywhere
• body-parser
• dotenv