Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/agussuwerdo/wa-bot
A real-time WhatsApp message monitoring dashboard built on node.js using whatsapp-web.js.
https://github.com/agussuwerdo/wa-bot
whatsapp-bot
Last synced: about 2 months ago
JSON representation
A real-time WhatsApp message monitoring dashboard built on node.js using whatsapp-web.js.
- Host: GitHub
- URL: https://github.com/agussuwerdo/wa-bot
- Owner: agussuwerdo
- Created: 2024-11-09T05:33:00.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2024-11-13T04:55:44.000Z (about 2 months ago)
- Last Synced: 2024-11-13T05:28:43.914Z (about 2 months ago)
- Topics: whatsapp-bot
- Language: CSS
- Homepage:
- Size: 277 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# WhatsApp Bot Monitor
A real-time WhatsApp message monitoring dashboard built on node.js using whatsapp-web.js.
## 🚀 Features
- **Real-time Message Monitoring**: Live updates of incoming WhatsApp messages
- **Message Statistics**: Track total and media message counts
- **Send Messages**: Send messages directly from the dashboard
- **Receive Messages**: Receive messages from WhatsApp## 💻 Technologies Used
- **Frontend**:
- HTML5
- Tailwind CSS for styling
- JavaScript (Vanilla) for interactivity
- WebSocket for real-time updates- **Backend**:
- Node.js
- Express.js
- WhatsApp Web.js
- WebSocket Server- **UI Components**:
- DaisyUI for enhanced UI components
- Tailwind CSS for styling## 🎯 Technical Highlights
- **Real-time Updates**: WebSocket implementation for instant message updates
- **Efficient Message Handling**: Smart message queue system with a 100-message display limit
- **Security**: HTML escaping for safe message rendering
- **Modern CSS**: Utilization of Tailwind CSS for maintainable styling## 🛠️ Getting Started
1. Clone the repository
2. Install dependencies:
```bash
npm install
```
3. Build the CSS:
```bash
npm run build
```
4. Start the development server:
```bash
npm run dev
```## 🔧 Environment Setup
Create a `.env` file in the root directory with the following variables:
```
env
PORT=3000
NODE_ENV=development
```- **Frontend Development**
- Tailwind CSS
- JavaScript ES6+
- Real-time data handling- **UI/UX Design**
- Component-based design
- WhatsApp-inspired patterns## 📸 Screenshots
![Login](./screenshots/login.png)
![Index](./screenshots/index.png)## 🙏 Acknowledgments
- [whatsapp-web.js](https://github.com/pedroslopez/whatsapp-web.js) - The excellent WhatsApp client library that powers this project's core functionality
- Built with [Node.js](https://nodejs.org/) and [Express.js](https://expressjs.com/)## 📝 License
MIT License - feel free to use this project for learning and development purposes.
---