https://github.com/harundogdu/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.
https://github.com/harundogdu/twitter-clone

axios date-fns hot-toast mongodb nextauth nextjs node-js nodejs prisma react react-spinner swr tailwind twitter twitter-clone typescript zustand

Last synced: 23 days ago
JSON representation

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.

• Host: GitHub
• URL: https://github.com/harundogdu/twitter-clone
• Owner: harundogdu
• License: mit
• Created: 2023-03-28T22:33:19.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-09-05T12:57:10.000Z (2 months ago)
• Last Synced: 2024-10-01T00:42:52.148Z (about 1 month ago)
• Topics: axios, date-fns, hot-toast, mongodb, nextauth, nextjs, node-js, nodejs, prisma, react, react-spinner, swr, tailwind, twitter, twitter-clone, typescript, zustand
• Language: TypeScript
• Homepage: https://twitter-clone-hd.vercel.app/
• Size: 1.15 MB
• Stars: 53
• Watchers: 3
• Forks: 12
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        




  

# Twitter Clone

This is a [Twitter](https://twitter.com) Clone project built with [Next.js](https://nextjs.org/), [Prisma](https://www.prisma.io/), [MongoDb](https://www.mongodb.com/), [Tailwind](https://tailwindcss.com/), [Typescript](https://www.typescriptlang.org/) and [NextAuth](https://next-auth.js.org/) libraries. It is a full-stack project that uses [Next.js](https://nextjs.org/) for the frontend and [Prisma](https://www.prisma.io/) 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.

  

  

![](https://img.shields.io/website-up-down-green-red/http/monip.org.svg)

![](https://img.shields.io/badge/Maintained-Yes-indigo)

![](https://img.shields.io/github/forks/harundogdu/twitter-clone.svg)

![](https://img.shields.io/github/stars/harundogdu/twitter-clone.svg)

![](https://img.shields.io/github/issues/harundogdu/twitter-clone)

![](https://img.shields.io/github/last-commit/harundogdu/twitter-clone)



    View Demo

   · 

    Documentation

   · 

    Report Bug

   · 

    Request Feature

  







## :star2: About the Project










## :toolbox: Getting Started

### :bangbang: Prerequisites

- Sign up for a MongoDB account HERE

- Install Node JS in your computer HERE

### :key: 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.

## :gear: Installation

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

Clone the repository

```bash

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

```

Install dependencies


```bash

npm install

```

Generate Prisma Client with the following command


```bash

npx prisma generate

```

Run the development server


```bash

npm run dev

```

Open [http://localhost:3000](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.



## :notebook_with_decorative_cover: 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.

## :notebook_with_decorative_cover: 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.

## :notebook_with_decorative_cover: 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).

## :space_invader: 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)





## :handshake: 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](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.

Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.