The project was inspired by Facebook's Instagram and was developed only for educational purposes. The application was built using React with Redux as the container for the global state, styles are applied with the help of styled components. It is integrated with serverless backend from firebase where it is also deployed.
> Live demo here https://instagram-clone-a6ece.web.app/.
Test user credentials:
- login:
one@test.com
- password:
test1234
- React - version 17.0.2
- Redux - version 4.1.2
- styled-components - version 5.3.3
- Firebase - version 9.6.1
- formik version 2.2.9 and yup version 0.32.11
The application allows a logged in user (managed by firebase authentication) to perform actions specified below.
- Creation of the user's account (registration on firebase authentication), form build with the formik and yup libraries
- Addition of posts with image and description
- Following other users
- Liking and commenting followed users posts
- Changing account's information
- Node.js - version 16.13.1
- npm - version 7.6.3
- Clone repository from github
- Initialize project on the firebase platform and provide credentials to firebase application in React (link to documentation https://firebase.google.com/docs/web/setup).
- Install all dependencies.
npm install
- Create a
.env
file and insert the following code. Replace values with credentials from firebase.
REACT_APP_FIREBASE_API_KEY = "firebase-api-key";
REACT_APP_FIREBASE_AUTH_DOMAIN = "firebase-auth-domain";
REACT_APP_FIREBASE_PROJECT_ID = "firebase-project-id";
REACT_APP_FIREBASE_STORAGE_BUCKET = "firebase-storage-bucket";
REACT_APP_FIREBASE_MESSAGING_SENDER_ID = "firebase-messaging-sender-id";
REACT_APP_FIREBASE_APP_ID = "firebase-app-id";
REACT_APP_FIREBASE_MEASUREMENT_ID = "firebase-measurement-id";
USER_DEFAULT_ICON = "link-to-firebase-storage-with-image";
- Start the server and application.
npm start
Items used in this project belong to their creators/authors and are not claimed by author of this project and people that use it.