Присоединяясь к Всемирной сети Internet

Вы уже взрослые люди со своим автор­ским сайтом блога с кастомным ЦСС и инте­рес­ней­шими замет­ками. Пора вам узнать, что будет, если убрать -­-­serve из npx @11ty/e­leventy -­-­serve.

Иногда в папке _site оста­ются арте­факты от  -­-­serve — удалите папку и вызо­вите npx @11ty/e­leventy вновь.

11ty попыхтит чуть дольше обыч­ного и пере­с­ге­не­ри­рует папку _site в полно­стью неза­ви­симую от какого-­либо кода папку со статичным сайтом. Это займёт около минуты в первый раз, и где-то 5 секунд или полми­нуты во все после­ду­ю­щие. Всё.

Эту папку, будем звать её билд, уже сейчас можно хоть на сервер поло­жить и у вас будет рабочий сайт. Это если у вас есть сервер.

Допустим, у вас есть сервер

Есть веро­ят­но­сть, что у вас уже есть сайт на каком-­нибудь Ворд­прессе и вы исправно башляете хостингу по паре тысяч рублей каждый месяц. Вам будет просто: подго­товьте чистую папку с доменом или поддо­меном на сервере в дирек­тории /www/, подклю­чите SSL-­сертификат, найдите IP и порт вашего сервера.

Дальше два пути: визу­альный и нормаль­ный.

Для нормаль­ного пути вам нужен Терми­нал, команды ssh и scp

Для визу­аль­ного вам пона­до­бится WinSCP, PuTTY или ещё какое прило­жение для синхро­ни­за­ции. Создайте в них сессию с данными вашей учётной записи в роли юзер­нейма и пароля.

...и синхро­ни­зи­руйте папку _site с таргетом на сервере.

Either way, поздрав­ляю, ваш сайт теперь во всемирной паутине. Не забы­вайте платить хостингу и по полми­нуты гене­ри­ро­вать билд на своём компью­тере. Закры­вайте заметку, дальше инфа, как этого избе­жать.

Допустим, сервера у вас нет.

Если вам ок после каждой заметки гене­ри­ро­вать сайт с нуля, вам доста­точно просто выбрать бесплатный хостинг статичных вебсайтов и заки­ды­вать папку _site на сервер через WinSCP, веб-­интерфейс или ssh. Таких хостингов много, выби­райте на свой вкус: Vercel CLI, Netlify Drop, Neocit­ies, etc.

Если вы готовы потра­тить ещё 20 минут и завести аккаунт на Гитхабе, покажу вам, как деле­ги­ро­вать гене­рацию папки сайта серверу.

Jamstack-провайдеры: делегируем генерацию сайта хостингу

Джемстек-­провайдеры дают вам не только место на жёстком диске, но и немного времени процес­сора — для того, чтобы вы могли гене­ри­ро­вать билд сайта на сервере, а не на вашем компью­тере.

Джемстек-­провайдеров, рабо­та­ющих с сайтами на Элевенти, много, но я агитирую исполь­зо­вать Netlify — просто потому, что в Триреме уже настроен плагин, который позво­ляет Нетлифаю не пере­со­би­рать сайт с нуля.

Нетлифай даёт 300 минут процес­сор­ного времени в месяц и авто­ма­ти­чески пере­со­би­рает ваш сайт всякий раз, как вы вносите изме­нения в его гитхаб-­репозиторий. Кстати, вам нужен гитхаб-­репозиторий.

Сайд-квест: настраиваем git

Я не буду учить вас, как завести аккаунт на Гитхабе и как открыть свой первый (публичный или приватный) репо­зи­то­рий. Пусть он пока будет пустой, вам нужна только ссылка на него в формате https://github.com/author/repo.git

Этот репо­зи­торий мы запол­ним, после того, как настроим git-­систему вашей папке с исход­ни­ками блога. Для этого в Терми­нале (там же, где вы вызы­ваете npx @11ty/eleventy) вызо­вите git init. Если вы в ответ видите ошибку вроде «команда git не распо­зна­на», погуг­лите реше­ния. В случае Виндовс я советую просто скачать последний Павершелл и запус­кать все команды через него:

После того, как у вас зафу­рычит git init, закон­нек­тите вашу папку с вашим репо­зи­то­рием Гитхаба и запушьте первый коммит. Я не помню точных инструк­ций, потому что поль­зо­ваться git из командной строки больно, но должно быть что-то вроде.

git remote add origin https://github.com/YOURNAME/YOURREPO.git
git add .
git commit -m "first commit"
git push -u origin main

В резуль­тате должен выско­чить попап авто­ри­за­циии, а после Терминал выплюнет сооб­щение в стиле «при­нято, зака­чиваю изме­нения на сервера Гитха­ба». Прокон­суль­ти­руй­тесь с ЧатГПТ и СтакО­вер­флоу, если что не рабо­тает.

Зайдите на стра­ницу вашего Гитхаб-­репозитория и убеди­тесь в свой круто­сти.

Возвращаемся к Джемстек-провайдерам

На примере Netlify — захо­дите на https://www.netlify.com/, жмёте бирю­зовую кнопку, следуете инструк­циям. Всё.

Должно выйти чёт-­такое спустя полми­нуты времени на гене­рацию билда:

That’s pretty much it. Личный домен можно купить рублей за 300 в любом пере­ходе, но я советую избе­гать крупных продавцов типа reg.ru — есть нену­левой шанс, что они через год прогреют вас на продление по завы­шенной цене. Я покупаю домены на https://ru-tld.ru/ — там всё настолько допо­топно, что даже опла­тить можно только ИП.

Когда вы выка­тите сайт чита­телям и начнёте регу­лярно постить, обно­вить сайт можно будет просто запушив изме­нения в репо­зи­торий с вашего компа.

git add .
git commit -m "update"
git push

Бонус: личная кнопка опубликовать.

Я не знаю, какой способ загрузки сайта на сервер выбрали именно вы, но знаю, что все эти действия можно описать в несколько команд Терми­нала — будь то ssh и scp или git push.

Для системы с Нетли­фаем это строчка git add .; git commit -m 'update'; git push

Как разбе­ре­тесь, какие команды нужны конкретно в вашем случае — поло­жите их в отдельный файл скрипта: это .bat или .sh в зави­си­мости от вашей опера­ци­онки. Сделайте для этого скрипта ссылку на рабочем столе и дайте ей красивую иконку.

Теперь вы можете забыть всю техни­че­скую часть создания блога на Триреме как страшный сон. Просто пишите заметки в заме­точ­нике и жмите на иконку «Опуб­ли­ко­вать».

Всё!

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