Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/thealoneprogrammer/whatsapp-clone

Whatsapp Clone is a progressive web application that clones the WhatsApp web, which is created for one-to-one messaging using VueJs, Vuex and TypeScript, and Cloud Firestore.
https://github.com/thealoneprogrammer/whatsapp-clone

chat-application firebase firestore one-to-one-chat real-time real-time-chat vuejs vuetify vuex whatsapp whatsapp-chat whatsapp-clone whatsapp-web whatsapp-web-clone

Last synced: 2 days ago
JSON representation

Whatsapp Clone is a progressive web application that clones the WhatsApp web, which is created for one-to-one messaging using VueJs, Vuex and TypeScript, and Cloud Firestore.

Host: GitHub
URL: https://github.com/thealoneprogrammer/whatsapp-clone
Owner: thealoneprogrammer
Created: 2020-11-22T09:50:42.000Z (almost 4 years ago)
Default Branch: master
Last Pushed: 2021-04-20T09:46:57.000Z (over 3 years ago)
Last Synced: 2024-09-19T20:02:02.517Z (8 days ago)
Topics: chat-application, firebase, firestore, one-to-one-chat, real-time, real-time-chat, vuejs, vuetify, vuex, whatsapp, whatsapp-chat, whatsapp-clone, whatsapp-web, whatsapp-web-clone
Language: Vue
Homepage: https://whatsgram-1dc4e.web.app/
Size: 292 KB
Stars: 20
Watchers: 3
Forks: 4
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

Whatsapp Clone is a progressive web application that clones the whatsapp web, which is created for one-to-one messaging using VueJs, Vuex and TypeScript and Cloud Firestore.

## [Demo](https://whatsgram-1dc4e.web.app/)

# Features!

- google auth SSO
- One-to-One realtime messaging with emoji chat
- Logging Out

### Tech

Whatsapp Web Clone uses a number of open source projects and other services to work properly:

* [VueJs](https://github.com/vuejs/vue) - Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
* [Vuex](https://github.com/vuejs/vuex) - Centralized State Management for Vue.js.
* [TypeScript](https://github.com/microsoft/TypeScript) - TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
* [Vuetify](https://github.com/vuetifyjs/vuetify) - Material Component Framework for Vue
* [Cloud Firestore](https://firebase.google.com/) - Cloud Firestore is a NoSQL document database that lets you easily store, sync, and query data for your mobile and web apps - at global scale.

### Installation

Install the dependencies and devDependencies and start the server.

Clone this repository
## Project setup
```
yarn install
```

### Compiles and hot-reloads for development
```
yarn serve
```

### Compiles and minifies for production
```
yarn build
```

### Lints and fixes files
```
yarn lint
```

### Development

Verify the deployment by navigating to your server address in your preferred browser.

```sh
127.0.0.1:8000
```

### Screenshots

![login](https://user-images.githubusercontent.com/38497682/99902368-634b2700-2ce3-11eb-85da-2def830354ba.png)
![chat-list](https://user-images.githubusercontent.com/38497682/99902371-67774480-2ce3-11eb-9ea5-1a0641f77e4d.png)
![chat](https://user-images.githubusercontent.com/38497682/99902374-69d99e80-2ce3-11eb-8421-ad8826a424c0.png)
![Desktop-1606043991184](https://user-images.githubusercontent.com/38497682/99902502-50852200-2ce4-11eb-868f-35e76ad1bdc1.gif)

### Todos

- Enable group Chat
- Add Dark Mode
- Many more...