Migrating to React Email

​

From MJML

​

Manual

1. Remove the mjml npm package and install react-email and @react-email/components
2. Find all MJML templates ending with the .mjml extension and convert these to React components with the .tsx or .jsx extension.
3. Replace MJML standard component tags with React Email component tags where possible, including <Text>, <Img>, <Button> etc.
4. Convert custom MJML components with the .js extension to React components with the .tsx or .jsx extension.

​

Automated

If you have a lot of MJML files to convert, this migration can be quite tedious! You can also automate this process with Second’s MJML → React Email migration module. Just connect Second to your GitHub repo, run the module, and get a pull request.