This project is an Instagram clone built using Next.js, Tailwind CSS, NextAuth, Recoil, and Firebase as a database. It implements clean architecture throughout the project.
- Users can sign up and log in using Google Authentication
- Users can post posts with a picture and captions
- Users can like and comment on other users' posts
- Users can follow and unfollow other users
- Users can watch other users' stories
- Next.js
- React
- Firebase Firestore
- Firebase Storage
- Tailwind CSS
- NextAuth
- Recoil
To install and run this project on your local machine, follow these steps:
- Clone this repository onto your machine
- Navigate to the project directory in your terminal
- Run 'npm install --legacy-peer-deps' to install all the required dependencies
- Open Firebase Console > Create a new project > Click on Project Settings > Click on Web app > Click on Register app
- Copy the config data and paste it into the "const firebaseConfig" in the firebase.js file
- On the Firebase Project click on Authentication - Get Started > Click on Google > Click Enable > Set support email > Click on Web SDK configuration and open the .env.local file:
- Set the Web client ID into the GOOGLE_CLIENT_ID variable (without "")
- Set the Web client secret into the GOOGLE_CLIENT_SECRET variable (without "")
- Click on Save
- Go to cloud.google.com and sign in to the same account > Click on Console > Make sure you are on the correct project > Click on the Menu - Api & Services > Credentials > Edit the OAuth:
- Add http://localhost:3000 to the "Authorised JavaScript origins"
- Add http://localhost:3000/api/auth/callback/google to the "Authorised redirect URIs"
- Click on Save
- Open Firebase > Firebase Database > Create Database > Start in test mode > Click Next > Click Enable
- Go to Storage > Rules > Change line 5 to - allow read, write: if true; > Click Publish
- Run 'npm run dev' in your terminal to start the project on your local machine
