This App is a clone of LinkedIn's login and home page, created using React and React Redux. It was created as a portfolio project to solidify and showcase skills with React, Redux and Cloud Firestore.
The App uses React Redux to manage state and Material UI for styling. It is deployed on Netlify, and user data is stored in Cloud Firestore. Users can register with their name, email, and password, and create new posts which will render onto the feed section. On refresh, the user will stay logged in as login details are stored in Redux.
-
User can access the app via the following link: Helena's LinkedIn Clone
-
Once loaded, user can follow below steps (please do not input any sensitive data):
This project was bootstrapped with Create React App, using the Redux and Redux Toolkit template.
-
Insert your Name
-
Profile Pic URL is optional
-
Insert Email
-
Insert Password
-
Click on 'Register Now'
-
User can create new post which will render onto Feed section
-
Click Avatar in the header to logout
-
On refresh, user will stay logged in as login details are stored in Redux
-
Once registered, user can Sign In with registered details
To run this project, you will need to have Node.js installed on your machine. You will also need to have a Firebase account set up with a Cloud Firestore database.
-
Clone this repository to your local machine
-
Run npm install to install the necessary dependencies
-
Create a .env.local file in the root directory and add your Firebase credentials:
REACT_APP_FIREBASE_API_KEY=<your-api-key>
REACT_APP_FIREBASE_AUTH_DOMAIN=<your-auth-domain>
REACT_APP_FIREBASE_PROJECT_ID=<your-project-id>
-
Run
npm start
to start the developent server- Open http://localhost:3000 to view it in your browser.
- React Redux
- Material UI
- Cloud Firestore
- Deployed on Netlify
-
You can learn more in the Create React App documentation.
-
To learn React, check out the React documentation.
-
To explore Firebase, check out this website.
-
For styling, find out more in the Material UI.