Modern fullstack Reddit clone, built with Next.js & Tailwind and deployed on Vercel.
- React 19
- Next.js 16
- NextAuth.js
- Drizzle ORM
- Shadcn UI
- Tailwind CSS
- TypeScript
- UploadThing
- 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
- Next.js
/appdir - 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,lintandtypecheckCI steps with GitHub Actions - ... and much more
To run it locally, follow the steps below:
-
Clone repository and install the dependencies:
# Clone repository git clone git@github.com:peterkibuchi/shreddit.git # Install dependencies pnpm i
-
Copy
.env.exampleto.envand update the variables.cp .env.example .env
-
Sync the Drizzle schema with your database
pnpm db:push
Note: If you are pointing at a database that was previously managed by Prisma, baseline it first with
pnpm drizzle-kit pull --init(or verify parity by confirming thatpnpm db:pushreports no changes) before ever running generated migrations against it. The schema maps onto the existing Prisma-created tables as-is; only the legacy unusedExampletable is no longer tracked and can be dropped manually. -
Start the development server:
pnpm dev
Project is: complete.
- This is a T3 Stack project bootstrapped with
create-t3-app. - Many thanks to Josh for inspiring this project.
This project is open source and available under the MIT License.