Instagram Clone

Overview

This project is an Instagram clone built as a full-stack web application, featuring a React front end and Firebase backend. The goal was to recreate the core functionality of Instagram, allowing users to sign up, log in, post images, reels and view a feed of posts from other users.

Features

Signup

• Allows users to create a new account.
• Validates user inputs and stores user data in Firebase.

Login

• Registered users can log in with their credentials.
• Secure user authentication is provided using Firebase Authentication.

Feed

• Users can view a feed of posts uploaded by other users.

Post Creation

• Users can create posts by uploading images, Reels and add captions to share with others.

User Profile

• user can see all the posts and reels uploaded by them in their profile section.

Reels section

• Users can explore short video content in the reels section, similar to Instagram's reels feature.

Theme Change

• Instagram clone includes a theme change feature, allowing users to switch between light and dark modes.
• This enhances the user experience by providing a personalized appearance.

How to Use Theme Change

1. Navigate to the More section in Home page or profile section to find the theme change(Switch Mode) option.
2. Click the "Switch Mode" button to switch between light and dark modes.
3. Enjoy a visually pleasing experience based on your preferred theme!

Log Out

• Instagram clone includes Logout, allowing users to securely logout from their session.

How to Use Log Out

1. Navigate to the More section in Home page or profile section to find the Log Out Option.
2. Click the "Log Out" button to end the current session.
3. Your Data is secure.

Technologies Used

• Frontend: React, React Router, CSS, HTML, Bootstrap.
• Backend: Firebase (Firestore for database, Authentication for user management).
• Storage: Firebase Storage for image and video storage.
• Deployment: The application is deployed using Netlify.

Getting Started

To run this project locally, follow these steps:

1. Clone the repository: git clone https://github.com/your-username/instagram-clone.git
2. Install dependencies: npm install
3. Configure Firebase: Set up your Firebase project and replace the Firebase config in src/components/Firebase/Firebase.jsx with your own configuration.
4. Run the application: npm start

Author

• Lavanya S

Credits

• Built with JS,HTML, CSS, and Bootstrap.
• Images and Reels from Instagram.
• Icons from Bootstrap Icons