Skip to content

lazenyuk-dmitry/html-responsive-email

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

46 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Html Responsive Email Boilerplate

Russian Federation Russian README

This is a starter boilerplate for a simple layout of responsive emails based on MJML and Gulp.

Features:

  • Develop emails using the MJML framework in the code editor using Gulp.
  • Check templates for errors.
  • Using environment variables. For example, to load local images during development and replace asset paths during build with remote resources.

See documentation.

Editor and plugins

Recommended to use Visual Studio Code + MJML Plugin

Get started

  • npm run install - to install all dependencies.
  • npm run dev - to develop and run a server with hot reload.
  • npm run build - to build all emails and minify the code.

Documentation

Framework documentation of MJML here

ENV Injection

You can embed env variables in templates. The plugin gulp-inject-envs is used.

Example:

  • Path to resources, already set as env ASSETS_PATH=/assets, see package.json build and dev scripts. you can set different variables for different environments.

  • Available in templates like <ENV::ASSETS_PATH>. For example:

      <img src="<ENV::ASSETS_PATH>/logo.png" alt="Logo">

Recommended directory structure

  • dist - build output directory and server root.
  • src/assets - resources directory.
  • src/components - MJML templates to include. Documentation.
  • src/pages - e-mail pages.