Challenge Engineer Life !

エンジニア人生を楽しみたい!仕事や趣味で学んだ技術的なことを書いていくブログです。

MJMLのTry it liveでレスポンシブメールを作成する

MJMLはMailjet Markup Languageの略語で、Mailjetが中心となって開発しているメール(レスポンシブメール)をデザインするためのマークアップ言語&フレームワークです。

mjml.io

ローカル環境でMJMLを試そうとするとnpmを使ったインストールなどが必要なのですが、「Try it live」を使うとWeb上で簡単に試すことができます。

mjml.io
f:id:kikutaro777:20190901234702p:plain

コンポーネントの中にはメールではわりと珍しいaccordionやcarousel、hero、navbarなどがあります。
https://mjml.io/documentation/#standard-body-components

ドキュメントがしっかりしているので、簡単に試せるのがいいです。ドキュメントのnavbarを試したのがこちら。
f:id:kikutaro777:20190902001952g:plain

右上の「View HTML」ですぐHTMLが取得できるので、たとえばSendGridなどにも簡単に取り込めます。
f:id:kikutaro777:20190902003055p:plain

MJMLは前々から触りたいと思っていたのですが、環境構築がめんどくさそうだな…と勝手な思い込みで避けてしまっていました。Try it liveを使えば簡単に触れるので、色々試していきたいと思います。

にほんブログ村 IT技術ブログへ
にほんブログ村 にほんブログ村 IT技術ブログ Javaへ
にほんブログ村