I developed this project during classes and as a challenge of my latest studies on React lessons at Rocketseat.
- React + Next.js + TypeScript
- shadcn/ui
- React Query
- Stitches
- NextAuth.js + Google oAuth + GitHub oAuth
- PostgreSQL + Prisma + Neon
This project was developed based on a figma design provied by the school. The main practice was to code a full-stack "Rate a Book" app. On the app the user can access with signin or just as a guest.
It was used NextAuth.js along with Google and GitHub accounts integration for authentication. All data was stored using a PostgreSQL database, in production was setted a Neon database. On development was used MySQL. Prisma was used to interact and manage with database.
On the first user access it's possible to enter dashboard as logged user with possibility of rating a book or as a guest for only viewing data. On dashboard are available the last book rated by the user, a paginated feed with latest book rated on app, and a small list of popular books. On explorer, the user can search for a book by a search field and by category. On profile are shown latest user ratings and stats of books readed and rated. By clicking on any rate or book a modal is opened containing book information and it's latest ratings, also, its possible to post a rating if the user is logged.
# Database PostgreSQL
DATABASE_URL=""
DATABASE_DIRECT_URL=""
# Google oAuth
GOOGLE_CLIENT_ID=""
GOOGLE_CLIENT_SECRET=""
# GitHub oAuth
GITHUB_CLIENT_ID=""
GITHUB_CLIENT_SECRET=""
# Next Auth
NEXTAUTH_URL=""
NEXTAUTH_SECRET=""
# Options
NEXT_PUBLIC_ENABLE_API_DELAY="false"