AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |
Back to Blog
Mjml border8/13/2023 Say goodbye to endless HTML table nesting or email client specific CSS. Get your speed and productivity boosted with MJML’s semantic syntax. □ Wanna learn more about code quality? Read our blog article " GraphQL errors: the Good, the Bad and the Ugly". Overview MJML rolls up all of what Mailjet has learned about HTML email design over the past few years and abstracts the whole layer of complexity related to responsive email design. Feel free to ask questions or give feedback on how you are currently developing emails, we are eager to hear from you! We are still tinkering with a few things to make it easier to use, but we hope you enjoyed this article. There is a demo package in the repo for you to try out. We would feed this to the MJML compiler: const document = (body) => `Ĭonst html = mjml2html(document(mail( from "svelte-emails" We would compile the Svelte code to HTML using the compiler's SSR capabilities: const mail = (props) => ` We would write Svelte code with MJML elements: All the technologies we mentioned were never meant to work together, but there seemed to be a way. Our challenge now is not only to write MJML with Svelte but also to have a simple way to preview and test emails. MJML, Svelte, Vite, Square pegs and Round holes The title probably ruined the surprise, but hey, we chose Svelte. We now need a way to make these emails dynamic, with logic and string interpolation. It is battle-tested, has a lot of features, and is easy to learn. There are plenty too! This is the path we took because it is the most flexible and powerful option.īecause we had some experience with MJML we decided to stick with it. Use an XML-based email templating language. Depending on what you want to achieve, this might be the best option. ![]() It would work well for static emails with a few string interpolations, but not for dynamic emails with a lot of logic, which we need. There are a lot out there! Turns out emails are hard to design. Not possible for Escape, but you might consider it. Send plain text emails, like good ol' text messages. ![]() I might have picked this approach for a personal project. ![]() This is way too slow for a company, but there is a lot to learn on the way. Write them by hand and learn the quirks of the old -based layout system with loads of and inline styles. We, therefore, have four possibilities to write emails: Well, unfortunately for us, email clients are still stuck in the dark ages. It was the way to design complex two-dimensional layouts. If you started web development before 2000, chances are you worked on websites designed with -based layouts. We, at Escape, recently rebuilt our whole email stack from scratch to improve the developer experience: we used to send emails to preview them, whereas now, we have an instant feedback loop, leveraging a SvelteKit-powered dev server. And you will end up working with some of the most legacy web technologies. As a developer, you will need to send emails at some point. Emails are the cornerstone of automated internet communication.
0 Comments
Read More
Leave a Reply. |