hasanaliilter / twitter-clone

This is a Twitter Clone project built with Next.js, Prisma, MongoDb, Tailwind, Typescript and NextAuth libraries. It is a full-stack project that uses Next.js for the frontend and Prisma for the backend. It is a Twitter clone that allows users to create an account, login, logout, follow other users, like and retweet tweets and more.

Twitter Clone

This is a Twitter Clone project built with Next.js, Prisma, MongoDb, Tailwind, Typescript and NextAuth libraries. It is a full-stack project that uses Next.js for the frontend and Prisma for the backend. It is a Twitter clone that allows users to create an account, login, logout, follow other users, like and retweet tweets, and more.

View Demo · Documentation · Report Bug · Request Feature

🌟 About the Project

🧰 Getting Started

‼️ Prerequisites

• Sign up for a MongoDB account HERE
• Install Node JS in your computer HERE

🔑 Environment Variables

To run this project, you will need to add the following environment variables to your .env file

DATABASE_URL

NEXTAUTH_JWT_SECRET

NEXTAUTH_SECRET

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

⚙️ Installation

A step by step series of examples that tell you how to get a development env running Clone the repository

git clone https://github.com/yourusername/twitter-clone.git

Install dependencies

npm install

Generate Prisma Client with the following command

npx prisma generate

Run the development server

npm run dev

Open http://localhost:3000 with your browser to see the result.

Available Scripts

• npm run dev - Runs the app in the development mode.
• npm run start - Runs the app in the production mode.
• npm run fresh - Drops the database, creates a new one, and runs all migrations.
• npx prisma db seed - Runs the seed file.

📔 Prisma

Prisma is an open-source database toolkit that makes it easy for developers to reason about their data and how they access it. It is used to query a database inside a Node.js or TypeScript application.

📔 Prisma Schema

The Prisma schema is the single source of truth for your database schema. It describes your database tables, columns, and relations. It also defines which operations are available on your data.

📔 Prisma Client

Prisma Client is an auto-generated and type-safe query builder for Node.js & TypeScript. It's used as an alternative to writing plain SQL, or using another database access tool such as SQL query builders (e.g. SQLAlchemy) or ORMs (e.g. TypeORM).

👾 Built With

• Typescript (for type safety)
• Next.js (for server-side rendering)
• Prisma (for database access)
• Node.js (for running scripts)
• SWR (for data fetching)
• Hot-Toast (for toast notifications)
• Next-Auth (for authentication)
• Axios (for making HTTP requests)
• React-Icons (for icons)
• Zustand (for state management)
• Bcrypt (for hashing passwords)
• Prisma-Adapter (for next-auth configuration)
• Date-fns (for manipulating dates)
• Dropzone (for turns HTML element)
• React-Spinners (for a collection of loading)

🤝 Authors

• Ahmet Enes Bahar
• Atahan Tutar
• Harun Doğdu
• Yusuf Alperen Dumlu

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.