Обживаемся в интернете с одним только доменом не платя ни копейки за хостинг

Возможно вам захотелось свой сайт. Или блог. Или просто почту на своём домене, чтобы красиво. А возможно вас пугает перспектива мигрировать все свои аккаунты на новую почту. Не суть важно — поехали делать комбайн с одним только доменом без хостинга!

Примечание: эта заметка не имеет ультра подробных инструкций и в целом рассчитана на людей, которые знают, в чём разница между git и GitHub и как примерно работает DNS.

Обзаводимся доменом

Домен можно либо купить за 150-1500 рублей в год (смотря в какой зоне; .ru самые дешёвые), либо получить бесплатно — в зонах .tk, .ml, .ga, .cf, и .gq (конечно, со звёздочкой).

Если вы собираетесь покупать домен за деньги, то советую обратить внимание на менее популярных регистраторов вроде Fozzy, Timeweb, Beget и других — у них обычно более низкие и прозрачные цены и лучше поддержка.

Получаем домен бесплатно

Бесплатные доменные имена в зонах .tk, .ml, .ga, .cf, и .gq выдаёт регистратор Freenom. Но конечно всем нам очевидно, что бесплатный сыр только в мышеловке, за сами следующие предупреждения:

Freenom, согласно пользовательскому соглашению и отзывам, может сделать продление вашего домена платным, если он станет достаточно популярным. Не критично для личных сайтов визиток, но стоит держать это в уме — регистратор очень сомнительного качества (зато бесплатно).

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

Переносим домен на DNS Cloudflare

После этого стоит перенести DNS хостинг домена к Cloudflare, поскольку а) мы воспользуемся сервисом Cloudflare для настройки почты, б) он объективно один из лучших.

Для этого необходимо сделать следующее:

Зарегистрироваться на Cloudflare.com
В разделе Websites добавить свой сайт
После этого вам выдадут два адреса, которые нужно прописать в раздел nameservers у регистратора вашего домена вместо стандартных.

Обновление именных серверов вашего сайта обычно занимает до нескольких часов (хотя иногда всего пару минут).

Проверить текущий статус можно командой dig (или похожими веб сервисами): dig example.com NS +noall +answer

Пока вы ждёте переноса — можете ознакомиться сервисами, которые есть в бесплатном тарифе Cloudflare. Чем сильнее вам нравится делать разные крутые штуки в программировании и около, тем сильнее у вас загорятся глаза :)

Настраиваем почту

Настройка получения писем (inbound)

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

Для пересылки писем на наш адрес мы будем использовать Cloudflare:

Открываем наш сайт в личном кабинете cloudflare
Выбираем раздел Email → Email Routing
Cloudflare предложит нам автоматически добавить все необходимые DNS записи. Соглашаемся.
Выбираем тип пересылки, который нам нужен:

Кастомные адреса: пересылка только с конкретных адресов, которые вы настроите, например contact@example.com или admin@example.com, остальные игнорируются.
Catch-all: пересылаются любые адреса, например asdfgh@example.com или github@example.com (рекомендую именно этот тип, вы сможете регистрироваться на любых сайтах адресом с названием сайта).

Выбираем адрес куда пересылается письмо.
Всё, вы восхитительны!

Хорошей альтернативой пересылке от Cloudflare может стать сервис forwardemail.net, но в нём пересылка настраивается через DNS TXT запись вида forward-email=user@gmail.com, что раскрывает целевой ящик кому угодно, кто решит проверить DNS записи вашего домена: (. В остальном сервис отличный!

Настройка почтового клиента на входящие письма (если вы пользуетесь отдельным приложением, а не вашей почтой в браузере): согласно вашему провайдеру почты. Искренне сочувствую пользователям Protonmail и Tutanota, где не поддерживается IMAP (то есть самому себе).

Настройка отправки писем (outbound)

С отправкой всё несколько сложнее, потому что получать репутацию спам сервиса никто не хочет, а спамеры будут использовать любые возможности, поэтому этим мало кто занимается. Согласно статистике, 40% всего трафика электронной почты это спам (а раньше было 80%).

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

Всё достаточно тривиально:

Регистрируемся и заходим в личный кабинет
Добавляем адрес сайта
Подтверждаем добавлением указанных DNS записей в админке Cloudflare
Создаем нового пользователя SMTP в разделе SMTP Users.

При добавлении DNS записей в профиле smtp2go можно изменить имена поддоменов, например на smtp.example.com, etc.

Вместо использования стандартных SPF/DKIM/DMARC проверок, SMTP2GO использует технику VERP, поэтому вам не нужно обновлять SPF записи и т. д., вам нужна только CNAME запись на return.smtp2go.com, которую вы уже добавили выше.

Я также пробовал зарегистрироваться в сервисе Sendgrid, однако он требует полной верификации для использования (ФИО + Телефон) и не рассчитан для личного использования — он также требует подтверждения компании через соцсети или иным способом.

Настройка почтового клиента на исходящие письма (для всех): тут для любого софта / конкретно для Thunderbird.

Всё, отправляйте тестовое письмо!

Настраиваем сайт

Если вам нужен статический сайт (визитка, блог, etc), то проще всего использовать Jekyll и GitHub Pages, что и будет описано дальше.

Блог, например, можно сделать с помощью всё того же Jekyll (если тема такое поддерживает) или Hugo, либо с помощью сервисов вроде Teletype (где вы и читаете эту статью).

Я выбрал второе из-за WYSIWYG редактора и отсутствия необходимости каждый раз добавлять статьи в качестве Markdown файлов на гитхаб и встроенных комментариев.

Хочу обратить ваше внимание, что существует достаточно большое количество сервисов, которые позволяют встраивать динамические элементы со своих серверов, например Commento.io для комментариев или полноценных Headless CMS систем.

Выбор темы для Jekyll

Для начала необходимо выбрать тему для Jekyll. Традиционно GitHub Pages поддерживал только минимальное количество тем, которые ещё и плохо настраивались.

Но с недавних пор там появилась поддержка развёртывания сайтов с помощью GitHub Actions, из-за сайты теперь можно делать на чём угодно, а для Jekyll выбирать какие угодно темы. Собственно подобрать их можно, например, тут:

На моём сайте — wido.dev — стоит тема Minimalist.

Развёртывание и настройка темы

С настройкой темы у всех всё индивидуально, поэтому обращайтесь к документации выбранной темы. А вот развёртывание у всех примерно одинаковое:

Ставим Ruby и Bundle (если он у вас не идёт вместе с Ruby)
Скачиваем нужную тему, переходим в её директорию
bundle config set --local path "vendor/bundle"
bundle install
bundle exec jekyll serve — учтите, что он автоматически перезагружает контент сайта, но не _config.yml
Играйтесь, настраивайте

Публикация сайта

Для публикации сайта на GitHub Pages вам необходимо:

Создать репозиторий для сайта (если у вас есть GitHub Pro — можно приватный, иначе — публичный) и залить туда результаты вашей настройки
Перейти в настройки → Pages и в разделе Source выбрать GitHub Actions
Выбрать Jekyll (НЕ «GitHub Pages Jekyll») среди списка всех Workflow
В разделе Jobs -> build -> "Build with Jekyll" YAML файла, который нам предложит отредактировать GitHub, убрать --baseurl "${{ steps.pages.outputs.base_path }}"
То есть должно остаться только: run: bundle exec jekyll build
(этот шаг нужен чтобы разместить сайт на корне вашего домена, а не example.com/repositoryname)
Вернуться в настройки Pages и прописать свой домен (можно поставить галочку Enforce HTTPS)
Войти в Cloudflare и прописать следующие настройки DNS (на всякий случай актуальные адреса тут), не забудьте снять галочку Proxy:

Тип записи | Имя | Адрес
A             @    185.199.108.153
A             @    185.199.109.153
A             @    185.199.110.153
A             @    185.199.111.153
AAAA          @    2606:50c0:8000::153
AAAA          @    2606:50c0:8001::153
AAAA          @    2606:50c0:8002::153
AAAA          @    2606:50c0:8003::153
CNAME        www   your-username.github.io

Всё, ждите обновления DNS записей.

Если вам нужен только блог на главной странице без возни с Jekyll

В случае Teletype это делается достаточно просто: создаём блог, в его настройках указываем ваш домен и нужную DNS CNAME запись:

Если вам нужно, чтобы ваш блог отображался на главной странице:
CNAME @ domains.teletype.in
Если по поддомену (например blog.example.com):
CNAME blog domains.teletype.in

И нажимаем кнопочку подтверждения после обновления. Всё!

Из альтернатив есть ещё Hashnode, но мне не нравится насколько он агрессивно рекламирует себя (как сервис) и как он выглядит. На эту тему даже есть статья: «Бесплатные» пользовательские домены Hashnode предназначены для одной цели: рекламы Hashnode

Бонус: верификация домена на GitHub

Зайдите в настройки своего профиля GitHub, раздел Pages, укажите адрес своего сайта и добавьте указанную DNS TXT запись в Cloudflare. Подождите обновления, нажмите кнопочку Verify.

Проверить состояние DNS записи можно так:

dig _github-pages-challenge-YourUsername.example.com +noall +answer TXT

Бонус: итоговый вид DNS таблицы

Итоговая таблица в админ-панели Cloudflare

Домашнее задание: облака и serverless

Если вы хотите сделать что-то динамическое, то советую глянуть на Yandex Cloud и Cloudflare R2. У первого очень неплохие бесплатные лимиты на Serverless вычисления (Yandex Cloud Function), а R2 предоставляет чудовищные 10 гигабайт хранилища в месяц бесплатно!

Это уже совершенно другая тема, но потенциал, как видите, огромный :)

Если вам нужно что-то попроще, то можно использовать pipedream.com — это IFTTT на стероидах с вебхуками.

Удачи!