Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/asha-saini06/instagram-clone
Instagram Clone project with core features like user authentication, profile management, photo sharing, feed, likes, comments. Using React and Firebase, it is a great resource to learn social media platform development.
https://github.com/asha-saini06/instagram-clone
clone firebase reactjs social-media
Last synced: about 2 months ago
JSON representation
Instagram Clone project with core features like user authentication, profile management, photo sharing, feed, likes, comments. Using React and Firebase, it is a great resource to learn social media platform development.
- Host: GitHub
- URL: https://github.com/asha-saini06/instagram-clone
- Owner: asha-saini06
- Created: 2024-01-18T18:24:42.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-02-22T15:39:07.000Z (11 months ago)
- Last Synced: 2024-02-22T16:43:47.868Z (11 months ago)
- Topics: clone, firebase, reactjs, social-media
- Language: JavaScript
- Homepage: https://an-insta-clone.vercel.app/
- Size: 6.71 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Instagram Clone
This repository contains the code for an Instagram clone, built using React and Firebase. It aims to replicate some of the core features of the popular social media platform Instagram.
## Features
- **Authentication**: Users can sign up for an account, log in, and log out securely.
- **Profile Management**: Users can update their profile information, including their profile picture and bio.
- **Image Upload**: Users can upload images to their profile.
- **Feed**: Users can view posts from other users on their feed.
- **Likes and Comments**: Users can like and comment on posts.
- **Follow/Unfollow**: Users can follow and unfollow other users to see their posts on their feed.## Technologies Used
- **React**: Frontend framework for building user interfaces.
- **Firebase**: Backend service for authentication, storage, and database functionalities.
- **React Router**: For handling navigation within the application.
- **Chakra UI**: UI library for building accessible and customizable React components.## Installation
1. Clone the repository:
```bash
git clone https://github.com/asha-saini06/instagram-clone.git
```2. Navigate into the project directory:
```bash
cd instagram-clone
```3. Install dependencies using npm or yarn:
```bash
npm install
```
or
```bash
yarn install
```4. Create a Firebase project and set up authentication, storage, and Firestore database. Copy the Firebase configuration details.
5. Create a `.env` file in the root directory of the project and add the Firebase configuration details in the following format:
```bash
REACT_APP_FIREBASE_API_KEY=
REACT_APP_FIREBASE_AUTH_DOMAIN=
REACT_APP_FIREBASE_PROJECT_ID=
REACT_APP_FIREBASE_STORAGE_BUCKET=
REACT_APP_FIREBASE_MESSAGING_SENDER_ID=
REACT_APP_FIREBASE_APP_ID=
```6. Start the development server:
```bash
npm start
```
or
```bash
yarn start
```7. Open your browser and navigate to `http://localhost:3000` to view the application.
## Login Details
Email: [email protected]
Password: inumaki