whatsapp.hyperjump.tech

Introduction

Documentation for the Monika Notification Service

This is the documentation for the Monika Notification Service that is deployed at whatsapp.hyperjump.tech.

Monika notification service is a service that allows you to send notifications from Monika to your WhatsApp number for FREE.

Project Structure

The project is using a monorepo structure using Turborepo and pnpm. It contains the apps (in apps directory) and packages (in packages directory).

Apps

  • web: The Next.js web app that allows user to register their whatsapp number and to get the unique URL to use in their Monika configuration. They can also get the instructions to use Monika with WhatsApp. This app also allows user to delete the webhook from our database.
  • facebook-webhooks: The Hono server that handles the webhooks from Facebook.
  • notify-api: The Hono server that handles the notifications from Monika. The URL of this server is used in the Monika configuration.
  • notify-api-netlify: The Netlify Functions app that serves the notify-api app.
  • whatsapp-mock-server: The mock server that simulates the WhatsApp API for development purposes.
  • docs: This documentation app which is using Fumadocs to generate the documentation.

Packages

  • env: The package that contains the environment variables for the project. Use this package to read environment variables in the apps and packages.
  • whatsapp: The package that contains the WhatsApp API client and other helpers to send messages via WhatsApp.
  • database: The package that contains the prisma client, schema, and other helpers to interact with the database.
  • ui: The package that contains the shadcn components and other UI components which can be used in the apps like web.
  • eslint-config: The package that contains the eslint config which can be used in other apps and packages.
  • eslint-config-custom: The package that contains the custom eslint config which can be used in other apps and packages.
  • typescript-config: The package that contains the typescript config which can be used in other apps and packages.
  • utils: The package that contains the utility functions which can be used in other apps and packages.

The flow

The 3 main apps in this project are web, notify-api, and facebook-webhooks. The main flow of the project is as follows:

  1. User visits the web app to register their WhatsApp number.
  2. The web app generates a unique webhook URL and sends it to the user via WhatsApp. The webhook URL points to the notify-api app.
  3. When Monika sends a notification to the notify-api app, the notify-api app will send the notification to the WhatsApp number.
  4. The facebook-webhooks app will receive the webhook request from Facebook and store the event to the database.

The flow of the project