Priyanshu88 / Slack-Clone

A website like Slack which is created using ReactJS, the React-Router is implemented for the different pages, React-Redux has been used as a state management tool. The firebase is used for the authentication and firebase firestore is used as a realtime database. Firebase-hooks are being implemented, styled-components are used.

Home Page:https://slack-clone-2d669.web.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

logo

Slack Clone with REACT.JS!

A website like Slack which is created using ReactJS, the React-Router is implemented for the different pages, React-Redux has been used as a state management tool. The firebase is used for the authentication and firebase firestore is used as a realtime database. Firebase-hooks are being implemented, styled-components are used and Material-UI icons have been used.


📔 Table of Contents

🌟 About the Project

📷 Screenshots

  • Application Home page & Demo
2023-04-01-18-10-28.mp4

forthebadge forthebadge forthebadge

👾 Tech Stack

Client
Database and Hosting

Google

🧰 Getting Started

‼️ Prerequisites

  • Sign up for Firebase account HERE
  • Install Node JS in your computer HERE

🔑 Firebase Config

To run this project, you will need to add the following config of your project to firebase file

apiKey

authDomain

projectId

storageBucket

messagingSenderId

appId

measurementId

⚙️ Installation

Install my-project with npm

npx create-react-app my-project --template redux
cd my-project

Install dependencies

🧪 Install Firebase and Material UI

Install Firebase

Install Firebase and copy the config of your project and setup locally.

npm install firebase

Install Material UI

Install material ui icons

npm install @mui/material @emotion/react @emotion/styled

Install dependencies

🔶 Other Dependency Info

🏃 Run Locally

Clone the project

git clone https://github.com/Priyanshu88/Slack-Clone.git
cd Slack-Clone

Install dependencies This is a React.js project bootstrapped with create-react-app.

npm install

Start the server First, run the development server:

npm run start

This is a React.js project bootstrapped with create-react-app.

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying src/app.js. The page auto-updates as you edit the file.

Learn More

This project uses react-spinkit for smooth loading, react-firebase-hooks.

🚩 Deployment

To deploy this project run

Commands
firebase login
firebase init
npm run build
firebase deploy

🤝 Contact

Your Name - @twitter_handle - 2040020@sliet.ac.in

Project Link: https://github.com/Priyanshu88/Slack-Clone.git



Don't forget to leave a star ⭐️

About

A website like Slack which is created using ReactJS, the React-Router is implemented for the different pages, React-Redux has been used as a state management tool. The firebase is used for the authentication and firebase firestore is used as a realtime database. Firebase-hooks are being implemented, styled-components are used.

https://slack-clone-2d669.web.app


Languages

Language:JavaScript 90.2%Language:HTML 7.8%Language:CSS 1.9%