Первый пост в блоге на сайте
Это первый пост в этом блоге! Спустя кучу часов, проведенных за дебагом и настройки docusaurus, сотни раз введенные в терминал npm run start
, финальное npm run build && npm run serve
и вуаля - мы здесь.
Что тут будет публиковаться?
Сюда я буду переносить технические статьи и свои мысли из своего Obsidian, благо, движок docusaurus, упомянутый ранее, автоматически генерирует красивые странички из Markdown-файлов. Я довольно давно пытался найти способ делиться записями из своей базы знаний с другим и, перепробовал кучу способов, начиная от статей ВКонтакте и telegra.ph, заканчивая GitHub и Notion. Но по итогу, как вы видите, я пришел к куда более простому решению - одному GitHub-репозиторию со всеми заметками, который с магией CI/CD автоматически развертывает мой блог на сайте.
Раз уж я решил написать первую статью, то расскажу, как работает мой блог.
Технический обзор блога
Блог - React-приложение, использующее фреймворк docusaurus. Этот фреймворк создан для генерации простых и красивых сайтов документации к проектам, но в моем случае основную фичу я отключил за ненадобностью простым добавлением docs: false
в файл конфига. Docusaurus из коробки умеет в генерацию статичных HTML-страниц из Markdown (MD, язык разметки) и MDX (тоже самое, что и MD, но еще с поддержкой JSX), причем я даже сейчас не про блог - вы можете вставить в любое место MD-файл и будет создана страница с его именем: например, в /pages
я создал файл test.md
(можете посмотреть исходники блога на GitHub), и теперь он доступен по адресу https://difhel.dev/test.
Кажется, я уже упоминал про JSX? Да, тут можно просто в файле вставлять JS-код:
<button onClick={() => alert('Вы нажали кнопку!')}>Нажми сюда!</button>
Помимо этого, функционал сайта на Docusaurus можно практически бесконечно увеличивать за счет поддержки большого количества плагинов. Например, я установил плагин i18n, чтобы добавить поддержку как английского, так и русского языка. Ну и после всего вышеописанного, наверное, покажется банальным, но все-все-все внутренние страницы сайта можно изменить ручками в коде - сам сайт написан на React.
Где хранятся публикации в блоге и статика?
Публикации (MD/MDX) файлы лежат в папке /blog
проекта. Весь мой сайт доступен на GitHub, включая исходники постов в Markdown. Сайт автоматически деплоится после коммита на Vercel, это бесплатно и очень удобно, всем рекомендую.
Какие планы на будущее блога?
Добавить больше CI/CD - написать GitHub Action для проверки орфографических ошибок. Еще сильнее упросить процесс загрузки новых постов на сайт (сейчас нужно просто закинуть файл в папку и сделать коммит), поскольку Markdown в Docusaurus и в Obsidian не всегда совместим (например, Callouts работают по разному):
:::info
В Docusaurus они работают вот так
:::
В Docusaurus они работают вот так
А в Obsidian - так:
> [!info]
> Вот так.
[!info] Вот так.
Написать GitHub Action в виде Telegram-бота, для автоматически х уведомлений в канал о новых статьях
UPD: так как для работы комментариев (через виджет Telegram) в каждой статье требуется указывать пост, который к ней прикреплен, имеет смысл либо сначала создавать пост, а потом публиковать статью, либо усложнить бота и сделать так, чтобы бот публиковал сообщение о посте, получал ссылку на это сообщение, вставлял ее в конец конфига поста и все это коммитил в master.