Slack-Clone

KO | EN

gitlite — search

#swift #python #android #security #express #nodejs #plugin #golang #mysql #java #react #javascript

★ 55 Open GitHub ↗

Slack clone using React, MaterialUI with google-authentication & firestore database for a real-time chat across multiple channels.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

[![Contributors][contributors-shield]][contributors-url]
[![Forks][forks-shield]][forks-url]
[![Stargazers][stars-shield]][stars-url]
[![Issues][issues-shield]][issues-url]
[![GitHub license](https://img.shields.io/github/license/abhishekpatel946/Slack-Clone)](https://github.com/abhishekpatel946/Slack-Clone)

<a href="https://github.com/abhishekpatel946/Slack-Clone">
 <img src="https://github.com/abhishekpatel946/Slack-Clone/blob/main/src/assets/logo-readme.png" alt="Logo" width="80" height="80">
 </a>

<h3 align="center">Slack Clone</h3>

Slack Clone README template to jumpstart your projects!
 
 <a href="https://github.com/abhishekpatel946/Slack-Clone">Explore the docs»</a>
 
 
 <a href="https://github.com/abhishekpatel946/Slack-Clone">View Demo</a>
 Â·
 <a href="https://github.com/abhishekpatel946/Slack-Clone/issues">Report Bug</a>
 Â·
 <a href="https://github.com/abhishekpatel946/Slack-Clone/issues">Request Feature</a>

## Table of Contents

* [About the Project](#about-the-project)
  * [Built With](#built-with)
* [Getting Started](#getting-started)
  * [Prerequisites](#prerequisites)
  * [Installation](#installation)
* [Usage](#usage)
* [Roadmap](#roadmap)
* [Contributing](#contributing)
* [License](#license)
* [Contact](#contact)
* [Acknowledgements](#acknowledgements)

## About The Project

 <a href="https://github.com/abhishekpatel946/Slack-Clone">
 <img src="https://github.com/abhishekpatel946/Slack-Clone/blob/main/src/assets/slack_logo-ebd02d1.svg" alt="Logo" width="300" height="300">
 </a>

# Slack Clone

### Description
- Slack-Clone is a clone of a slack. Implemented using React and Firebase.
- Behind the backend, I was used React-Firebase for authentication with Google-auth, and highly secure specially for non-authorized users. 
- And I have developed a channel section to add new channels and communicate through these channels.
- I have used firestore to keep store all the messages spread among the channels or community. 
- And ofcourse our database will be safe under google-firebase security so no worries about securities.

### Features
- The channels or messages are stored in firestore database so quickly accessible via our app.
- I was used react-router-dom for saving server-side loads or refreshing. this functionality improve the speed for redirect to one component to another without refreshing from  server-side it makes life easier, save lots of time and fast to switch without loading or refreshing the whole page.
- Our data will be in real-time, if any changes make happens in messages or channels then it will automatically changes in our app in real-time no need to refresh our page.
the app will be responsive like if you used in Desktop or Mobile devices it render same thing.

### Built With
This section should list any major frameworks that you built your project using. Leave any add-ons/plugins for the acknowledgements section. Here are a few examples.
* [React](https://reactjs.org/docs/getting-started.html)
* [Firebase](https://firebase.google.com/docs)
* [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS)

## Getting Started

This is an example of how you may give instructions on setting up your project locally.
To get a local copy up and running follow these simple example steps.

### Prerequisites

This is an example of how to list things you need to use the software and how to install them.
* Clone
```sh
git clone https://github.com/abhishekpatel946/Slack-Clone.git
```

* Link
#### [Slack Clone](https://slack-clone-152da.web.app/)

## Installation

1. Clone the repo
```sh
git clone https://github.com/abhishekpatel946/Slack-Clone.git
```

2. Go to the Slack-Clone
```sh
cd Slack-Clone
```

3. Run the slack-clone in localhost
```sh
npm start
```

## Usage

![1!](https://github.com/abhishekpatel946/Slack-Clone/blob/main/src/assets/1.jpg)
![2!](https://github.com/abhishekpatel946/Slack-Clone/blob/main/src/assets/2jpg.jpg)
![3!](https://github.com/abhishekpatel946/Slack-Clone/blob/main/src/assets/3jpg.jpg)
![4!](https://github.com/abhishekpatel946/Slack-Clone/blob/main/src/assets/4jpg.jpg)

_For more examples, please refer to the [Documentation](#built-with)_

## Roadmap

See the [open issues](https://github.com/abhishekpatel946/Slack-Clone/issues) for a list of proposed features (and known issues).

## Contributing

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are **greatly appreciated**.

1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request

## License

Distributed under the MIT License. See [`LICENSE`](https://github.com/abhishekpatel946/Slack-Clone/blob/main/LICENSE) for more information.

## Contact

Project Link: [https://github.com/abhishekpatel946/Slack-Clone](https://github.com/abhishekpatel946/Slack-Clone)

## Acknowledgements
* [GitHub Emoji Cheat Sheet](https://www.webpagefx.com/tools/emoji-cheat-sheet)
* [Img Shields](https://shields.io)
* [Choose an Open Source License](https://choosealicense.com)
* [Firebase](https://firebase.google.com/)
* [MaterialUI](https://material-ui.com/)

[contributors-shield]: https://img.shields.io/github/contributors/abhishekpatel946/Slack-Clone.svg?style=flat
[contributors-url]: https://github.com/abhishekpatel946/Slack-Clone/graphs/contributors
[forks-shield]: https://img.shields.io/github/forks/abhishekpatel946/Slack-Clone.svg?style=flat
[forks-url]: https://github.com/abhishekpatel946/Slack-Clone/network/members
[stars-shield]: https://img.shields.io/github/stars/abhishekpatel946/Slack-Clone.svg?style=flat
[stars-url]: https://github.com/abhishekpatel946/Slack-Clone/stargazers
[issues-shield]: https://img.shields.io/github/issues/abhishekpatel946/Slack-Clone.svg?style=flat
[issues-url]: https://github.com/abhishekpatel946/Slack-Clone/issues
[product-screenshot]: https://github.com/abhishekpatel946/Slack-Clone/blob/main/src/assets/slack_logo-ebd02d1.svg

Slack-Clone

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README