muntaqam / goodread-clone-nextjs

This repository contains the source code for a Goodreads clone, an application designed to mimic the core functionalities of the popular book tracking and review platform, Goodreads

Check out the live site!

GreatReads - A Goodreads Clone

Welcome to GreatReads, a book discovery and tracking platform inspired by Goodreads. This project is built using React, TailwindCSS, and Supabase, leveraging the Google Books API for fetching book information and the New York Times API for retrieving popular book lists.

Technologies Used

• Frontend:

  • React.js: For building the user interface.
  • TailwindCSS: For responsive design and styling.
  • Redux: For state management.
  • Lodash: For utility functions.

• Backend:

  • Supabase: For database management and backend functionalities.
  • NextJS: For server-side rendering, API handling, and routing optimization.

• APIs:

  • Google Books API: For book information.
  • New York Times Books API: For popular book lists.

Features

• Book Browsing: Explore a vast collection of books.
• Book Details: View detailed information about each book, author, publication date, reviews, ratings, and a brief synopsis of the book.
• Popular Books List: Discover trending and popular books sourced from the New York Times API.
• User Interactions: Create an account, manage your book lists, write reviews and rate books and add books to your personal shelves.

Key Features

Book Discovery and Management

• Browse Books: Explore and search a wide range of books across various genres.

• Reading Progress Tracker: Keep track of the books you're currently reading, have read, or want to read.

  

User Account and Authentication

• User Registration: Sign up to create a personal account.

• Login/Logout: Securely access your account.

• Guest/Demo User Access: Browse the platform without creating an account.

  

Book Details and Interaction

• View Book Information: Access detailed information about books, including author, publication date, and synopsis.
• Book Reviews and Ratings: Read and leave reviews and ratings for books.

Integration with External APIs

• Google Books API: Fetch and display detailed information on a wide array of books.
• New York Times API: Access and showcase updated lists of trending and popular books.

Community Features

• User Profile Customization: Personalize your user profile picture, Read and leave reviews and ratings for books.

TODOs / Features to Implement

Here are some improvements and features that can be added to the project in the future:

• Add user reading progress to dashboard.
• Implement light and dark mode for better user experience.

Author Info

This project was created by Muntaqa Maahi. You can find more about me on my website: muntaqamaahi.com.

---

^{Back To The Top} 🔼

goodread-clone-nextjs's Issues

auth

• if user is logged in and tries to access /auth then it should just go to dashboard or something

user table

• figure out how u can get logged in user into the user table so that i can add a book to a shelf

rating error

• when user votes half star the avg rating doesnt reflect it

checklist P2

Book Shelf

• when book is added to shelf then there should be some sort of positive feedback so users know its added
• a book can be added to a shelf (unique)
• if a book is being added again to a shelf , errror message saying the book is alrdy on the shelf
• when u remove a book u should get feedback saying you removed the book
• only the booklist should be scrollable the hwole page shouldnt scroll
• if a book image is not available it should show default img

Discover Page

• when u click on a book it should take it to book[id] page
• search button , make it in a mini screen
• add autocomplete to search button
• style arrows - removed them
• style scrollbar
• add arrows

Book Details

• style the alert where it alerts user that theyre changing thier rating - unnecesary
• when updating comment, the relative time should show
• profile pic should show for user review
• add genre bubbles in the bottom - problem bc some dont have genre section
• when u search a diff book then the one that is shown the review doesnt show until u refresh it
• change color of the write a review..

Search bar in nav

• if user doesnt chose a title from the options instead clicks enter or search icon then it should show the search list page
• text is white, change to visible color
• when user presses enter u get an error
• use the SearchBar.js component in Navbar

dashboard

• close button doesnt work
• when user clicks outside of modal it should close
• book is visible in dashboard after adding it but it is uncategorized and pic is not shown until u refresh or go to the specific bookshelf
• when u hover over the user profile card it should show edit button
• the grey are behind the profile pic , do something with it, maybe add waves or something
• style the cards
• when user changes thier pic then the modal should close automaticaly

Reviews

• when u update review the relative time should also update

Screens

• add loading screen
• add error not found page

register

• add forget password option
• make a dummy guest login account

-fontpair
-https://haikei.app/

add reviews

• users can add review
• users can edit their review
• users can delete reviews
• users can view other peoples reviews

ratings

• add ratings feature
• 1-5 stars
• avg rating displayed

checklist p3

Issues

• when u log out and go to dashboard the previos dashboard flashes before redirected to /auth
• the books from nyt times list book[id] is diff from the google api one
• add a logo or the word "greatreads" on the auth page
• when u search sometimes if thummbnai not found it crashes , do if error then dont load it if it doesnt have
• when user hover over a book , cursor should be a hand
• when user hovers at the navbar drop down it should be a hand

checklist

AUTH

• can register
• can log in
• can not register email that has alrdy been registered
• can log out
• when logged out cant access dashboard

search books

• can search from homepage
• can search from navbar
• can click on books from searches

book details

• book title,author, cover is visible
• can rate books
• can view avg rating
• delete rating
• deleted rating reflects avg rating
• can add reviews
• review displays w username
• user can only review once per book even when user refreshs
• can add book to shelf

dashboard

• shelves are visible
• shelves reflect books that were added
• can remove shelved books
• can access book details by clicking on books in shelves

dashboard

• when u go on dashboard the user info should be on the right side at the top

search in navbar

• implement search
• show top 5 results
• click the book and it takes u to that book detials page

shelves

• add all section to see all my books

home page

remove book from shelf

• be able to remove a book from a shelf from dashboard

user profile

• user has a username
• user can upload profile pic
• user can update profile pic
• user can remove profile pic
• if user removes profile pic default pic shows
• user without pic has default pic

book page

• add description of book about this book
• add about this author if possible

login issue

• when user logs in sometimes the old dashboard show up until user refreshes

style the shelfing button

• style the drop down button on book cards if u wanna add to shelf
• when addeed then it should show that its been added to the shelf
• show a remove button if u add to shelf

navbar

• add my profile to navbar so users cna see thier profile(dashboard)
• add search icon in the navbar
• add home button to navbar

LoginGif

Uploading loginGif.mov…

test ratings

• user can rate books 1-5
• user can view avg rating before rating
• user can view updated avg rating after rating
• user can log out and log back in and see thier rating
• user can update thier rating

home button

• add a logo
• when u click on home logo it shouold take u home

protected route

• user who is not logged in should not be able to add books to shelves or rate if they arent logged in
• non logged in users should be redirected to /auth if attempted to