Shreddit

Modern fullstack Reddit clone, built with Next.js & Tailwind and deployed on Vercel.

Table of Contents

• Technologies Used
• Features
• Meta-Features
• Quickstart
• Project Status
• Acknowledgements
• License

Technologies Used

• React 18
• Next.js 13
• NextAuth.js
• Prisma
• Shadcn UI
• Tailwind CSS
• TypeScript
• UploadThing

Features

• Infinite scrolling for loading posts dynamically
• A beautiful and highly functional post editor
• Beautiful UI powered by Shadcn UI
• Light and Dark modes
• Authentication using NextAuth & GitHub
• Custom feed for authenticated users
• Image uploads (with UploadThing) & link previews
• Full comment functionality with nested replies
• ... and much more

Meta-Features

• Next.js /app dir
• React Client and Server Components
• Metadata configuration for improved SEO and web shareability
• Data fetching and mutation with React Query
• Graceful loading states and optimistic updates for a great UX
• Advanced caching with Upstash Redis
• Schema declarations and validations with Zod
• Typesafe code and best practices made possible by TypeScript, ESLint and Prettier
• Automated format, lint and typecheck CI steps with GitHub Actions
• ... and much more

Quickstart

To run it locally, follow the steps below:

1. Clone repository and install the dependencies:

   # Clone repository
   git clone [email protected]:peterkibuchi/shreddit.git
   
   # Install dependencies
   pnpm i
   

2. Copy .env.example to .env and update the variables.

   cp .env.example .env
   

3. Sync the Prisma schema with your database

   pnpm prisma db push
   

4. Start the development server:

   pnpm dev
   

Project Status

Project is: complete.

Acknowledgements

• This is a T3 Stack project bootstrapped with create-t3-app.
• Many thanks to Josh for inspiring this project.

License

This project is open source and available under the MIT License.