Задача
Сделать в браузере конструктор email-рассылок: маркетолог собирает письмо из готовых блоков без вёрстки, сразу видит, как оно выглядит на компьютере и телефоне, и отправляет себе тестовое письмо.
Что сделано
– SPA на React, Redux Toolkit и TypeScript, сборка на Vite;
– перетаскивание: структуры колонок и модули (изображение, текст, кнопка, разделитель, соцсети, меню, HTML, видео) бросаются в письмо мышкой, блоки можно переставлять;
– редактор текста на Slate: стили абзаца h1–h6, жирный, курсив, выравнивание, отступы, merge-теги;
– панель настроек у каждого блока и у письма целиком: тема, прехедер, оформление;
– UTM-метки ко всем ссылкам письма одной настройкой (utm_source, utm_medium, utm_campaign и др.);
– отмена и повтор действий, режим редактирования для телефона;
– превью сразу на десктопе и телефоне, тестовая отправка на почту.
Зачем
Вёрстка писем – самая неблагодарная часть рассылок: таблицы, инлайн-стили, разные почтовые клиенты. Конструктор убирает её из работы маркетолога.
Результат
Рабочий конструктор писем: от пустого шаблона до тестового письма в ящике без строчки кода.
https://hdzy.github.io/email_constructor/