![]() ![]() MJML is such a fantastic tool to build responsive email newsletters without the hassle and I am super happy to see a proper and simple Rails integration. Its recommended that you use the long-term support (LTS) version. the formats property has to be set to (not ). In order to use create-react-app, you need to have Node.js installed.the leading underscore is not necessary.For instance, each section of the newsletter could live in its own file.Ĭonsider the following header (taken from MJML documentation): When the mail gets a bit long or repetitive, it might be interesting to leverage the power of ERB to have separate files, and render them inside the main template. app/mailers/foobar_mailer.rb class FoobarMailer Hello Check types/mjml-react 2.0.6 package - Last release 2.0.6 with MIT licence at our NPM packages aggregator and search engine. Let’s create a very simple email through MJML to illustrate this article.įirst thing, in app/mailers, we create a foobar_mailer.rb file: #. ![]() Or if you already use some Node.js modules, you could also just add it to your package.json file: npm install -save mjml Building a MJML-powered email You can either install it globally to avoid adding a Node.js dependency to your project: npm install -g mjml Because of this, it needs mjml to be installed independently. The thing is, this gem is basically just a wrapper around the mjml npm package. While MJML is fairly recent, I was pleased to see there already is a fresh gem to plug it into Rails, called mjml-rails.įirst step would be to add it to the Gemfile. Therefore, I needed a way to integrate MJML in the Rails pipeline to be able to produce proper responsive emails based on dynamic data. Setting up MJML in RailsĪmaphiko is a Rails app. Now you can simply run index.html, all css, js is already linked in that HTML file, this build is just a normal version of your react app which will run in browser. MJML comes with about 20 components to build simple newsletters (texts, images, links, buttons, columns, tables, etc.) and can be extended by leveraging the power of React for advanced usage. Run npm build or yarn build, this will generate a build directory, in that you have static folder, index.html, all your css, js files, all minified, ready for deployment. Practically speaking, MJML is a markup language built on React that produces email-compliant (whatever that means) markup once compiled. MJML introduces itself as “the responsive email framework”. And since I won’t code email, at least not in this life, I had to find a workaround. This package allowed us to incorporate all the benefits of mjml without having to ask our developers to learn a new dev environment when moving from web to email. Based on project statistics from the GitHub repository for the npm package mjml-react, we found that it has been starred 933 times. Hello mjml community, we at Faire are excited to announce we will be taking over maintaining the open-source mjml-react project Over the past year, Faire has used mjml-react extensively. As such, we scored mjml-react popularity level to be Recognized. Recently, I had to implement an email for the Amaphiko project. The npm package mjml-react receives a total of 35,445 downloads a week. ![]()
0 Comments
Leave a Reply. |