How I used Amazon SES with MJML to create email templates in my side-project

How it started

I wanted to send emails to my users on https://weekhabit.paraboly.com.

First attempt: mail sending services

Of course, I started with mail sending services like SendGrid, Mailchimp, SendInBlue. They are awesome services but I faced with various difficulties:

  • one was asking to buy a block of emails while I wanted to fly in free limits because user base is small now.
  • in one I couldn’t even register
  • one had small UX error where I couldn’t test my mail template because I removed sender but I couldn’t understand it from error.

Another attempt: Amazon SES

For introduction, Amazon SES

  • is email service, supporting sending emails from CLI and SDKs.
  • doesn’t have template editor to create template. All templates must be created by users.

As any programmer, I wanted to code this mail sending. 😀

Here is ther overview of CLI(AWS CLI must be installed and made login) commands for SES(more information can found in SES docs)

aws ses list-templates
aws ses get-template --template-name simple-template
aws ses create-template --cli-input-json file://simple-template.json
aws ses update-template --cli-input-json file://simple-template.json
aws ses send-templated-email --cli-input-json file://simple-template-single-user.json
aws ses send-bulk-templated-email --cli-input-json file://simple-template-bulk-users.json

Example of simple-template.json

{
"Template": {
"TemplateName": "simple-template",
"SubjectPart": "Greetings, {{name}}!",
"HtmlPart": "<h1>Hello {{name}},</h1><p>Your favorite animal is {{favoriteanimal}}.</p>",
"TextPart": "Dear {{name}},\r\nYour favorite animal is {{favoriteanimal}}."
}
}

Example of simple-template-single-user.json

{
"Source":"WeekHabit Team <week-habit-team@paraboly.com>",
"Template": "mjml",
"ConfigurationSetName": "ConfigSet",
"Destination": {
"ToAddresses": [ "someuser@gmail.com"
]
},
"TemplateData": "{ \"name\":\"Alejandro\", \"favoriteanimal\": \"alligator\" }"
}

Note: ConfigSet must be created in Amazon SES console otherwise email will not be sent.

Problem

Did you notice that HtmlPart is very simple and more suitable for system emails where style is not important.

Also Amazon SES doesn’t have template editor, so how to create responsive and stylish email?(One of many advantages of email services)

mjml — responsive template framework

The mjml is tool which allows create responsive email. It has nice editor where you can design email template.

Standard workflow for generating email template html:

  1. Create template in editor https://mjml.io/try-it-live
  2. Copy to file, let’s name simple-template.mjml
  3. run(I assume that you installed mjml)
./node_modules/.bin/mjml -r simple-template.mjml -o simple-template.html
  1. Copy new-template.html to HtmlPart part of simple-template.json described above.
  2. Update template by running
aws ses update-template --cli-input-json file://simple-template.json

Example:

From personal blog: https://nurgasemetey.github.io/2020/amazon-ses-mjml-email-template/

--

--

--

https://nurgasemetey.com

Love podcasts or audiobooks? Learn on the go with our new app.

Implement Privado Cookie Consent in Wordpress website — Just in 3 Min

Getting started with Routing using Hooks

How to Convert Audio from wav to mp3 in JavaScript Using ffmpeg.wasm

Integrating D3.js(V4) and Angular (7.0)

React Routing 101

11 Stupidly Simple Side Hustles to Earn Extra Money as a Programmer

TechBlog 2020.05.26

Angular Fundamentals: Communicating with the Server Using HTTP, Observables, and Rx

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Nurgazy Nazhimidinov

Nurgazy Nazhimidinov

https://nurgasemetey.com

More from Medium

Remote Work and Rainbows

Youtube Vanced App Terminated Due To Threat From Google

Deleting Tik Tok To Save My Brain.

Top three Front end development Tools in 2022