Публикуем статический сайт с помощью Surge

Простые веб-страницы

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

Иногда всё, что требуется, особенно для всяческих экспериментов и прототипов, это залить несколько статичных файлов на сайт и опубликовать их на какой-нибудь адрес. Просто HTML, CSS, JS.

На прошлой неделе, меня попросили сделать квиз. Тест на 50 вопросов с выведением итогов по набранным баллам.

Я решил что здесь будет достаточно создать несколько HTML-страничек и добавить CSS и JS. За пару вечеров уже была готова основа для квиза.

Установка Surge

Потребуется Node.js:

npm install --global surge

Деплой с помощью Surge

Surge — это один из моих самых любимых инструментов в разработке.

Он создан как раз для таких случаев, когда всё что вам нужно, это захостить несколько статичных файлов.

Как это сделать с Surge:

Создаём папку, в ней создаём все необходимые файлы HTML, CSS, JS.
Создаём файл CNAME (большими буквами, без расширения) в котором пишем только имя домена: например, will-smith.surge.sh если хотите поддомен на surge.sh или же will-smith.com если у вас есть свой домен.
В консоли переходим в эту папку и выполняем команду
```
surge ./
```
Всё! Сайт зальётся на хостинг за несколько секунд.

В первый запуск вас попросят ввести Email и пароль, эту информацию Surge запомнит и больше не спросит.

Видео инструкция по Surge

Surge настолько прост и продуман что его и изучать почти не требуется.

Тем не менее на официальном сайте есть подробное видео с демонстрацией использования, на случай если где-то запутаетесь:

https://surge.sh/

Есть на сайте и текстовая документация.

Плюсы

Быстро

Основное что даёт Surge, это скорость. Cайт заливается за считанные секунды.

Моментальный деплой позволяет обновлять сайт при каждой правке, и локальный веб-сервер становится не нужен.

Исключаем промежуточный шаг и льём сразу “в прод”!

Удобно

Всё очень минималистично. Никаких лишних команд, ничего лишнего. Только вы, ваши файлы и деплой.

Дёшево

Пользуетесь бесплатно. Лимитов нет.

Свой домен

Выберите любой поддомен или подключите свой домен, полная свобода.

Минусы

HTTPS на свой домен — платный

Единственный минус который я могу назвать, это отсутствие HTTPS/SSL при подключении своего домена.

Чтобы подключить SSL сертификат собственного домена на Surge, придётся заплатить конские $30 в месяц.

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

Netlify

Если же вам требуется всё вместе: бесплатный хостинг статики, свой домен и HTTPS, то можете залить сайт на Netlify.

Например, этот блог хостится на Netlify, на моём личном домене и с поддержкой HTTPS абсолютно бесплатно. Плачу я только за сам домен регистратору.