One of the most important instruments in dealing with the spread of COVID-19 is having complete and accurate information about hygiene, the nature of the disease, and most importantly, the spread of the disease in different locations.

In this tutorial, you will learn how to use Twilio’s Programmable SMS and Twilio SendGrid to build a COVID-19 Alert Subscription System for providing accurate information to subscribed users.

Once finished, you will have developed a system that:

  • Allows users to subscribe to COVID-19 SMS and email alerts.
  • Allows an admin to broadcast COVID-19 updates to subscribers based on their selected location.
  • Sends SMS notifications to users in the subscribed area.
  • Sends email notifications to users in the subscribed area.

Project Requirements

In order to go through this tutorial, you will need the tools and technologies listed below:

  • Node.js installed on your system
  • Basic knowledge of JavaScript and Node.js
  • Basic knowledge of Vue.js
  • A Twilio Account (you can get started with one here)
  • A SendGrid Account (get started with a new account here)

Setting up the Backend Service

Express API Setup

To begin, you will need to set up the project for the application. Two sub-projects will be required in building the complete application: an Express.js project for the backend API, and a Vue.js project for the client-facing application.

Create a folder with the name covid-alerts at any preferred location on your system. This is the project folder that will hold the two sub-projects. Inside the folder, create a new folder named backend for the Express.js project.

In your command prompt, navigate to the root of the backend folder, and then run the following command to initialize the folder as a Node.js project:

npm init -y

The -y flag is added to skip the interactive process of the npm init command and instead, scaffold a barebones package.json file. You’ll also need the following packages:

  • express: The express package for conveniently creating Node.js APIs
  • body-parser: The standard Node.js body parsing middleware
  • cors: Node.js package for enabling and configuring CORS with various options
  • dotenv: To make use of environment variables
  • twilio: The Node.js package for working with the Twilio API for messaging
  • @sendgrid/mail: The Node.js package for working with the Twilio SendGrid Email API

You can install these all at once by running the following command at the root of the backend folder:

npm install express body-parser cors dotenv @sendgrid/mail

#code #tutorials and hacks #vue

Build a Covid-19 Alert System with Vue, Node, SMS and Twilio SendGrid
2.35 GEEK