Skip to content

Latest commit

 

History

3 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Send Stack

HTML email is broken. Every client renders differently, inline styles are mandatory, and half of CSS doesn't work. Most teams end up copy-pasting fragile HTML between campaigns and hoping nothing breaks in Outlook.

Send Stack fixes this. It's a CLI tool that combines MJML and Handlebars into a simple templating workflow — layouts, partials, variables, and a live preview server — so you can build emails the same way you build any other frontend: with components, data, and a dev server.

Write clean markup. Get production-ready HTML that works everywhere.

Quick Start

npm install
npm run build

Commands

Build

Compile all templates into production-ready HTML:

npm run build

Build a single template:

npm run dev -- build -t welcome

Minify output:

npm run dev -- build -m

Preview

Start a live preview server with hot reload:

npm run preview

Opens on http://localhost:3000 by default. Change the port with -p:

npm run dev -- preview -p 8080

New Template

Scaffold a new email template:

npm run dev -- new -n my-template

This creates:

  • templates/emails/my-template.mjml — your email markup
  • data/my-template.json — template variables

Validate

Check all templates for issues:

npm run dev -- validate

Project Structure

inspiration/   Screenshots of reference designs (gitignored)
templates/
  layouts/     Base MJML layouts
  partials/    Reusable components (header, footer, button)
  emails/      Individual email templates
data/          JSON data files for each template
assets/        Images and static files
dist/          Compiled HTML output (gitignored)
src/           CLI and build tooling

Workflow

The typical workflow for creating a new email:

  1. Find inspiration. Browse sites like Really Good Emails, Email Love, or similar galleries. Screenshot the designs you want to approximate.
  2. Drop screenshots in inspiration/. This folder is gitignored, but it's where you (or a CLI agent) reference the visual direction for your templates.
  3. Scaffold a template. Run npm run dev -- new -n my-template to create the MJML and data files.
  4. Build the template. Write your markup in MJML with Handlebars expressions, referencing the screenshots in inspiration/ for layout, typography, and spacing cues.
  5. Preview. Run npm run preview to see your email in the browser with hot reload.
  6. Validate and build. Run npm run validate to check for issues, then npm run build for production-ready HTML.

How It Works

  1. Write your email in MJML with Handlebars expressions
  2. Define variables in a matching JSON data file
  3. Handlebars compiles the template with your data
  4. MJML converts the result to cross-client compatible HTML

Templates can extend layouts and include partials, keeping your emails DRY.

Requirements

Node.js 18+

License

ISC

About

A CLI tool for building beautiful, cross-client HTML emails with MJML and Handlebars. Scaffold templates, live-preview in the browser, validate compatibility, and export production-ready HTML. Minimal config, fast iteration.

Resources

Stars

2 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages