In this article, we’ll learn how to send email notifications using Sendgrid dynamic email templates, so you don’t have to harcode email content in your backend. We’ll use Engagespot with Sendgrid provider to send emails with dynamic templates.

Before we start

Before we implement dynamic email template, make sure you have the following things

  1. Engagespot API_KEY and API_SECRET
  2. Sendgrid account & API_KEY

Design a Dynamic Email Template

Let’s login to Sendgrid and navigate to Email API -> Dynamic Templates

Click Create a Dynamic Template, and give your template a name. For example - Welcome email template

Click on the newly created “Welcome Email” template, and click on “Add Version

Let’s choose the Blank Design

Choose the Design Editor to edit our email template

Let’s drag and drop few modules to build a simple template like this

We’ve added a :::name::: placeholder, which we’ll replace from our code.

Now let’s see how to pass data to this email template using Engagespot API.

Send Email Notification From a Node.js Backend

We’ve designed an email template. Now let’s setup Engagespot in our app and send a notification from our Node.js backend.

First, we need to register our user’s with Engagespot. In this example, we’ll deliver the notification via In-App, Webpush and Email. For that, let’s make use of Engagespot REST API.

Make sure you’ve enabled Sendgrid Provider on your Engagespot dashboard.

You can send notification with the following code

{
  "notification": {
    "title": "Rose accepted your friend request"
  },
  "category":"new_friend_request",
  "data":{
     "name":"Jack",
  },
  "recipients": [
    "jack@example.com"
  ],
  "override":{
    "channels":["email","inApp"],
    "sendgrid_email:{
       "template_id":"tuj6Rfc3bCx37dFdslapqc78cbytG"
    }
  }
}

If you notice, you can see that we’re passing the name in the data object, which will be sent to Sendgrid where it will be replaced in your template!

Its simple as that. Now your notification will be delivered across two channels - Email and InApp.