Разработчики — разработчикам: виртуальный почтовый сервер

Иногда вместо работы над проектами нужно создать что-то свое, что в итоге упростит жизнь не только тебе и твоей команде, но и огромному сообществу разработчиков. Так у нас и получилось, когда тимлид Юра придумал Debug Mail. Мы запустили собственный сервис.

Что такое Debug Mail

Это виртуальный SMTP-сервер для тестирования почтовых рассылок при разработке сайтов, приложений. Когда они отправляются через электронную почту, у них разные сервисные сообщения, которые используются при использовании той или иной на почте.

Для того, чтобы не засорять личную или корпоративную почту, случайно не отправить тестовые письма реальным пользователям, мы создали сервис, который перехватывает и сохраняет тестовые письма на виртуальном сервере.

Как работает сервис

Сервис предоставляет командный доступ к виртуальному SMTP-серверу, который перехватывает и хранит тестовые рассылки. Адреса отправителя и получателя могут быть любыми, так как реальной отправки писем не происходит.

При создании проекта пользователь получает параметры подключения к smtp-серверу и login/password. На основе этих данных сервер определяет, к какому проекту относится то или иное полученное письмо.

Технология, используемая разработчиками приложения, не имеет значения, сервис будет работать с PHP, Python, Ruby, Node.js, .NET и так далее.

Функциональность

Сообщение на письмо отображается подробная информация о нем. Первая вкладка содержит адрес электронной почты отправителя и получателя, все заголовки письма, прямую ссылку на письмо. Вкладка Html содержит отрендеренный HTML-контент (если он задан, иначе вкладка не активна).

Также есть ссылка, которая запрашивает короткую ссылку для прямой ссылки на письмо.

Вкладка Plain (Обычное) отображает исходное нераспарсенное письмо.

Возможность совместного доступа

Возможность командного доступа — главная особенность сервиса. Чтобы посмотреть, как будут выглядеть сервисные и другие рассылки, достаточно подключить нужных пользователей к проекту в Debug Mail, и они увидят все то же самое, что и разработчик, который тестирует отправку писем.

Что можно делать в Debug Mail

• Отправлять письма не на реальные, а на тестовые несуществующие адреса.
• Решать проблемы с настройкой email-рассылок совместно с коллегами при командном доступе.
• В сервисе могут работать несколько разработчиков на промежуточном сервере.

Отличительные особенности сервиса

1. Его не нужно устанавливать на компьютер. Вы получаете доступ к личному кабинету с любого устройства.
2. Польза для работы тестировщика. Если в письме ошибка — тестировщик легко получит на него прямую ссылку и отправит ошибку в баг-трекер.
3. Удобство для дизайнеров. Если есть какая-то ошибка в дизайне письма, можно добавить к нему комментарии через сервис coment.me. Это делается в один клик.
4. Быстрый поиск сообщений, группировка по заголовку и дате получения.
5. Просмотр заголовков, html, text, plain-версий письма.
6. А еще можно показать письмо по прямой ссылке кому-то не приглашенному в проект, если есть необходимость.

Процесс разработки

Первую версию Юра придумал и запустил за 3 месяца в далеком 2012 году.

Подробно о бэкенд-разработке сервиса он рассказал в своем блоге. Я опишу здесь ключевые моменты процесса.

Технологический стек и рабочее окружение

Бэкэнд сервиса состоит из трех основных компонентов, которые можно запускать отдельно и масштабировать.

• SMTP-сервер, который получил все полученные письма и умеет отличать проект.
• REST Api, который позволяет выполнять операции по работе с проектами, пользователями и письмами.
• Сервер для поддержки обновлений в реальном времени при получении новых писем.

Нам было важно, чтобы приложение в реальном времени показывало новые и непрочитанные письма вне зависимости от того, где в интерфейсе находится пользователь.

Дизайн и проектирование

Проектирование я делал, основываясь на наблюдениях от удобства использования почтовых клиентов на макбуке. Мы делали сервис изначально только под свои потребности. В итоге оказалось, что наши требования удовлетворяют и других разработчиков. В сервисе нет ни одной лишней функции или детали — все четко и лаконично.

Дизайн сделали за месяц. Дизайнер Саша Резанов, который тогда работал над проектом, сделал невозможное — создал такой внешний вид Debug Mail, в который буквально влюбились все пользователи. Мы получили очень много положительной обратной связи именно за простоту использования и функциональный внешний вид нашего сервиса.

Фронтенд

О процессе фронтенда мы уже рассказывали ранее. Нам нужно было сверстать сервис за месяц, примерно столько же делали дизайн. Мы использовали технологию Флекс для верстки основного макета. С Флексом было легко добиться соблюдения сложной пропорции ширины трех основных колонок рабочей области сервиса при разных размерах окна.

Верстка же некоторых деталей порой отнимала чуть ли не больше времени, чем остальной макет. Но именно эти аккуратно выверенные детали и создают общее впечатление от сервиса.

У нас так получилось с выпадающими менюшками, где ситуация осложнялась фигурной полупрозрачной скругленной границей блока.

В итоге нам удалось пойти на компромисс с дизайнером и оставить выпадашку в том виде, в каком он планировал, а границы сделали непрозрачными.

Результат

Мы сами занимались продвижением сервиса, при этом не вкладывая огромные деньги в маркетинг. Все, что мы сделали — лендинг о сервисе с предложением оставить электронную почту, если сервис заинтересовал. Мы получили 100 имейлов и сделали по ним рассылку, когда выкатили сервис.

Сервисом пользуется 7 тысяч человек. Наши клиенты — лучшие ИТ-компании, Tech Media (например, Тематические Медиа) и разработчики, которым наш сервис оказался полезен. Множество положительных отзывов от пользователей нашего продукта это доказывает.

Узнайте, сколько стоит разработка сервиса Debug Mail в WB—Tech.

Подпишитесь на блог WB—Tech

Никакого спама, только анонсы новых статей!