Тернистий шлях створення блогу мій досвід, фейли і плани

Книга є хорошою, коли змушує задуматися. Стаття — коли спонукає до дії.

Це перше пафосне речення, яке спало мені на думку при написанні цієї статті. Тут я розповім, чому взагалі почав писати блог, звідки ідея створення власного ком'юніті, з якими траблами зіштовхнувся під час розробки самописного сайту на Next.js, який в мене roadmap, ну і взагалі висновки.

Навіщо я виршів створити свій блог

На початку літа згадав уривок з книги The Pragmatic Programmer:

"Learn at least one new language every year"

Моя спеціалізація — це JavaScript екосистема, але я вирішив попробувати щось нове. Хотів мову з світу системного програмування. Мова на які можна писати драйвери, ОС, швидкий софт тощо.

Думав між C++ і Rust. З одного боку — C++ бетон у світі IT, з іншого — Rust Позиціонується як сучасна та безпечншіа альтернатива але з маленькою екосистемою. Не довго думаючи, я обрав Rust — гіпстерську, модну, нову.

Почав читати офіційну книгу The Rust Programming Language і паралельно зацікавився Matrix протоколом. Але наткнувся на проблему — офіційна реалізація серверу Synapse написана на Python, а це:

• багато їсть пам'яті

• складний для самохостингу

• не дуже дружній до анонімності

• можливі витоки метаданих (менш критично, але все ж)

Існують ще кілька альтернативних реалізацій серверів для Matrix, написаних іншими мовами різними командами. Але мене не покидала думка зробити власну реалізацію — умовно кажучи, форк протоколу. Хотілося інтегрувати Tor, реалізувати фічі, схожі на Telegram, і при цьому зберегти фокус на приватність і автономність.

Паралельно з технічними думками прийшла ідея — ділитися всім цим досвідом публічно. Документувати не лише розробку проєкту, а й загальні технічні інсайти. І, можливо, з часом зібрати навколо себе спільноту, з якою можна буде реалізовувати цікаві ідеї — як open source, так і комерційні.

Ще раніше в мене вже був накинутий фундамент персонального сайту 2.0, тож ці роздуми дали поштовх продовжити його розробку та додати блог.

Разом з блогом на персональному сайті поча ввести твітер та планую дублювати статті на платформах такі як meddium можливо ще на linkedin.

Чому не Medium одразу? Бо хотів набити руку на Next.js і мати повну свободу на власному домені.

Трабли розробки самописного рішення

Використовував фулстек-фреймворк Next.js. Для мультимовності — next-intl, для авторизації — next-auth. Логін потрібен тільки для адмінки. Як ORM обрав Drizzle.

Найцікавіше почалось при зборці:

• Проблеми з next-auth при білді — перша описана в цьому пості

• Друга — не передавав параметр secureCookie: true, через що токен не повертався. Виправляється так:

const token = await getToken({ req, secureCookie: true, secret: process.env.NEXTAUTH_SECRET })

Хотів зробити ISG (Incremental Static Generation) для статей — але щось пішло не так, зараз працює SSR.

Tiptap і код

Налаштування Tiptap-редактора. Хотів красиве підсвічування синтаксису з code block lowlight. Але в HTML не було тегів для кольорів символів, тому вирішив рендирити статтю з тегом Editor з атрибутом editable: false. Проблема в тому що редактор вимагає DOM, а мені треба готовий HTML для кращого SEO. Тому поки показую код без підсвічування, генеруючи HTML на бекенді.

Деплой і несподіваний досвід

Деплой розтягнувся аж на 3 дня. Свої проекти зазвичай хощу на свому домашньому сервері. Одного ранку підходжу, торкаюсь сходів ногою, рукою до корпусу — і мене б’є током. Такого досвіду адміністрування серверу я не очікував)

Зараз фото трохи завеликі і на максимальні ширіні контейнера виглядають дивно, ближчим часом пофікшу)

Overengineering на старті

Спочатку хотів одразу реалізувати:

• теги

• пошук

• всі види медіа...

...але зупинив себе. Почав із мінімального. Хоча поки писав цю статтю — згадав, що досі не додав кнопку для видалення статті в адмінці)

Roadmap

Перше, що зроблю — можливість видаляти статті. Далі:

• Пофіксити розмір фото

• Пофіксити нумерацію) (зараз чогось тільки від 1 до 9)

• Теги (теми, категорії)

• Сторінка Roadmap (список проектів, статус, таски, нотатки)

• Можливий редизайн

• Коментарі до статей

• Адмін-аналітика

• Кількість переглядів

• Email-підписка

• Прикольна 404-сторінка

• Мемна сторінка при спробі увійти в адмінку :)

• Пошук статей

• Опитування під статтями / в мікроблозі

• Мікроблог (щось типу Twitter на своєму сайті)

Таски пофіксити розмір фото та нумерацію появилися тільки що при редагуванні статі)

Висновок

Робити свій самописний блог, коли є багато готових рішень?

Залежить від твого часу та цілей. Якщо хочеш набити руку на технології — так. Але готуйся: бавитися прийдеться багато)

Вихідний код лежить на Github, але поки що без документації в README.md лежить тільки h1

Якщо цікаво слідкувати за розвитком, приєднуйся до мого Telegram-каналу або Twitter/X. Буду радий зворотному зв’язку.