MJML Email Templates

What is MJML?

MJML is an intermediary templating language for generating HTML emails.

Why use MJML?

Writing HTML and CSS that renders accurately in all mainstream email client is difficult. By using MJML, we can code our templates simplistically, then transpile that code to the complicated HTML with inline CSS that is required by email clients.

How do we use MJML?

MJML does not currently support a native transpilation library for Elixir. For that reason, we manually transpile our MJML templates using the MJML app which can be obtained here: https://mjmlio.github.io/mjml-app/

MJML templates are stored in alerts_concierge/apps/concierge_site/assets/mjml/confirmation.mjml. The transpiled output is stored in alerts_concierge/apps/concierge_site/lib/mail_templates.

Because some of the files in mail_templates are generated, it is important to:

• not edit those files directly
• update both the MJML and HTML files when changes are made

Images for emails emails are stored on AWS s3 in the mbta-alerts/html_email bucket/folder to make email rendering work consistently locally and in production.

Is it worth it? Seems like a hassle...

It is a hassle. Creating HTML/CSS for emails manually however is a more tedious process that has produced worse results (in terms of final rendering) for this project historically.