DEV Community

Cover image for Using Sendinblue email API to send transactional emails
Frazier Odhiambo
Frazier Odhiambo

Posted on

Using Sendinblue email API to send transactional emails

Base case: A client requests that they need a feature allowing their clients to send certain information to their email. In addition to this, they provide a design template for their email. All you have to do is extract various information from the data sent and and that information to the email template.

Intro...

As a developer, you are bound to meet clients who wish to have features you might have not used before. An example of such is integration an emailing feature with a twist, the emalls sent will be part of an email marketing system. Recently, this was a position I found myself in when a client requested that the emails had to go through Sendinblue. The project is part of an automated insurance quotation system, built in Javascript, for the client to use in his field of personal health insurance brokerage in Kenya.

What is Sendinblue

So, what is Sendinblue? Sendinblue is a digital marketing platform that is preferred by digital marketers to create campaigns, from emails to sms, before sending them to their clients. In the process of learning about Sendinblue, I noticed it is possible to know when the message has been opened, links clicked or if the message has bounced (not sent). I will show you this shortly as we build this up.

Prerequisites

To build onto this, we will use NodeJs as our backend and a simple form built to accept our input. Also, I will be using Express just because I like using it. Below are the node modules or dependencies we will need to install for the system to work as it should. To make it clear, we will be using vscode and node (version 18) as our backend runtime.

  1. ejs (our templating language as I know)
  2. express (this is part of our backend framework)
  3. cheerio (this allows us to extract information from html sent to server)
  4. nodemon (I believe you know about this, same as watch)
  5. sib-api-v3-sdk (this is our sendinblue node module, interesting yes?)
  6. morgan (this will be our request logger, good for development phase)
  7. dotenv (this will process the env docs and variables we will create)

Let’s build

Step 1: set up our Javascript environment

Vscode startup page

Our first step is starting Vscode and launch our terminal. In this case, git bash was my terminal of choice (I just like it). Then in our terminal run the command npm init to set up the details of our project.

Step 2: Initiate our project
To initiate the project, install the dependencies by running the code below. The installation progress will be indicated by the progress bar similar to the one below on the console.

node modules installation progress bar on git bash console

To confirm the installation of the dependencies, got to the package.json file and confirm the details similar to the image below. Kindly note that depending on the time you located this article, the version of the dependencies may have changed. (I noticed I had not installed dotenv here, so please install it too)

confirming node dependancies installed in the package.json file

Step 3: Setup the Sendinblue account and get the API key

To be able to use the sendinblue api, we will need to register an account and for this, we can use a gmail account. Once done, our dashboard will appear as below, and the first thing to do is get our api key which will enable us to use the npm package that we just installed in our code. To get our api key, we will follow the steps below.

  1. On the dashboard click on the settings tab on your left
  2. Select the configuration option on the top of the settings page
  3. Under the HTTP API section, click on get your API Key
  4. In the new page, select API Keys tab as shown below
  5. Generate your new api key and even give it a custom name

Sendinblue SMTP api generation page

After creating a new API key, we will copy the API key string and assign it to a variable on our env file. The env file will help us protect the key making it private for application security. You wouldn’t want to compromise the security of your application, the price to pay is quite steep.

Step 4: Setting up the api code on your app

After creating your Sendinblue account and accessing your API key, we will need to setup the API codeblock in our application. If you are a fan of using specific routes for your processes, the API code structure will reside in our specific ruote. For example, if your have a ‘/send_email’ route dedicated to sending the emails, the api code below will be placed within this route. To understand the structure of the code you can visit the github repo here.

For this article, I will use the ‘/send_email’ route and in the route controller, place the code block below after requiring the Sendinblue API node module. Also, don’t forget to require the Sendinblue module that we installed in our application.

Sendinblue api code block

In the code block above, there are two interesting elements to note, the templateId and the htmlContent. In my working example, I had generated a template on the Sendinblue transactional email page and the templateId will be generated automatically as seen below. This is to distinguish which template to use for which campaign assuming your are running several email marketing campaigns on your system.

It would be a disaster confusing one campaign for another especially when you already have an established clientbase. If working with email templates are a long process for you, you can simple use the htmlContent to create an email template and then plugging the params variables within it to include the information collected from your form into the email before it is sent.

Email templates page on Sendinblue dashboard

I know we are jumping a lot but we are joining the dots slowly. Assuming you have as little variables and as limited functionality as in this Github repository, your completed file should mirror this.

complete code structure for Sendinblue api as seen on github

Assuming everything goes great and there is no issue in your system upto this level, you can now go back and send any details, in the context of this article, the form and the following message on your console should appear. Any other message besides this may indicate and error and the email will not be sent. So debugging will be your friend, but guided by clear error messages.

message on successful sending of the email through the api

Conclusion
Sendinblue API is a handy tool for a business that may be looking to start creating custom email templates for their clients. An additional feature not discussed in this article is the ability to track each email and its associated activities directly from Sendinblue dashboard after registration. Regarding the code above, if you have any issues or query feel free to comment or send me a message and I will be able to help you get the feature working. Happy coding.

Top comments (2)

Collapse
 
nataliiapolomkina profile image
nataliiapolomkina

Thank you, Frazier, it's a great guide with detailed instructions and visuals! I appreciate the practical use case and additional considerations. Just wanted to add my two cents — Mailtrap email API is also great for transactional sending (can go up to ~10,000 emails/second) as it comes with automatic IP warmup, dedicated IPs, suppression lists and actionable analytics

Collapse
 
frazie profile image
Frazier Odhiambo

@nataliiapolomkina Thank you for your comment. I will definitely look into Mailtrap and maybe have it as another whole documentation of how to use it on a different project.