Coder Social home page Coder Social logo

ashiquebiniqbal / botsapp Goto Github PK

View Code? Open in Web Editor NEW

This project forked from foyzulkarim/botsapp

0.0 0.0 0.0 5.97 MB

A bot builder on top of puppeteer's headless web browser mimicing your web.whatsapp.com functionalities.

Home Page: https://wabot.bizbook365.com

License: MIT License

JavaScript 91.82% HTML 1.54% Dockerfile 0.05% EJS 0.61% Less 6.00%

botsapp's Introduction

Welcome to the BizBook365 WhatsApp bot project

A bot builder on top of puppeteer's headless web browser mimicing your web.whatsapp.com functionalities.

Demo

wabot.bizbook365.com

Video explanation in Bangla

Watch the video

Technology stack

This repository is built on top of Express.js, React.js, MongoDB and venom library, however in the implementation detail, we will find other supporting technologies as well.

Client side

  • React - A JavaScript library for building user interfaces
  • Ant Design Pro - A design system for enterprise-level products. Create an efficient and enjoyable work experience
  • Testing Library - React Testing Library
  • Umi Request - HTTP client for the executing HTTP request from browser to server.

Server side

  • Node.js - evented I/O for the backend
  • Express.js - Fast, unopinionated, minimalist web framework for Node.js
  • MongoDB - The application data platform for NoSQL databases
  • Mongoose - mongoose
  • Swagger - Swagger (Not done yet)
  • Jest - JavaScript testing framework
  • Super Test - Super test API testing framework
  • venom-bot - Venom is the most complete javascript library for Whatsapp

Details frameworks and packages can be found in the package.json files in server and client directory.

Running the application

Visual Studio Code

Prerequisites

  • Node.js : To run npm packages
  • MongoDB : As a database for the application
Steps
  • To run via vscode, we should run the server and client side projects separately, and also make sure mongodb is up and running.

  • Create a .env file inside of the server directory. Add the below entries or change accordingly. You can follow the .env.sample file to see the format.

DB_HOST=localhost DB_PORT=27017 DB_NAME=appdb JWT_SECRET=secret JWT_EXPIRES_IN=100 PORT=5000 IS_MONGODB_CLOUD_URL=false MONGODB_CLOUD_URL=mongodb+srv:// : @cluster0.abcd.mongodb.net/myFirstDatabase?retryWrites=true DEFAULT_PAGE_SIZE=10 SENDGRID_API_KEY=123 FRONTEND_URL=http://localhost:8000 EMAIL_SENDER=[email protected] DEFAULT_EMAIL_RECEIVER=[email protected]


#### Server commands
We assume we run the MongoDB in the docker container.
```sh
cd server
npm i
npm run db:up
npm start

Client commands

cd client-pro
nvm use --lts
yarn
yarn start

Data seeding

To seed the database, we need to run the following commands in the server directory.

npm run db:seed
npm run db:migrate

You should be able to see the username and password in the /server/setup/users.json file. You can change these as you see fit.

Permission management ui

I have introduced a permission management ui for the application. Sample image is given below.

Product List Page

Centralized log to Sentry.io

We can also send the logs to sentry.io. To use this feature, we need to add the dsn entry into client/src/env.config.js. Setup snippet is like below in index.js file

Sentry.init({
  dsn: Config.dsn,
  integrations: [new Integrations.BrowserTracing()],
  tracesSampleRate: 1.0,
});

Test server API (NOT DONE YET)

To view the api, open your browser and visit http://localhost:5000/api-docs Ideally we should add all of the API endpoints into the swagger, but for the demo purpose, we only added Products API endpoint.
To test the APIs, we can reuse the postman collection. Open docs/rbac-mern-boilerplate.postman_collection.json into Postman and you should see the endpoints with appropriate payloads.

Scripts

Project Command Task
root npm run build Builds the containers
root npm run start Start the projects and database in docker containers
root docker exec -it appserver /bin/sh then npm run db:seed Executes seed products inside container
server npm i Install server side dependencies
server npm run db:up Start the database in a docker container
server npm run test Execute tests using jest
client npm i Install client side dependencies
client npm run start Start the react app
client npm run build Build the react app in production mode
client npm run test Execute tests using Testing Library

Types of testing

In this repository, we have included both unit testing and integration testing. For now, the code coverage is very low, but we are working on it to make it more than 90% somewhere in the future

Client side

  • We incorporated only unit tests in client side, and mock all the externals dependencies like localStorage and axios.

To run the tests, we can run npm run test command.

Server side

  • Integration testing: We have integrated the Jest as the testing library, and we have added supertest and mongodb-memory-server packages to make the integration testing easier.
  • Unit testing: We have used Jest to test the service layers and mock the external dependencies like MongoDB.

To run the tests, we can run npm run test command.

License

This project is [MIT licensed](https://github.com/facebook/react/blob/main/LICENSE. However other open source projects used in this repository contains their own license.

Contribution

For now, I am not taking any community contritutions in terms of code. But if you have any suggestions or you found any bugs, please feel free to open an issue or a pull request.

On the other hand, if you want to know something, or want to start a discussion about this project, please start a discussion in our GitHub's discussion board.

botsapp's People

Contributors

foyzulkarim avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.