#МетаПост

🤖🤝😁 Сьогодні метапост: я запостив цей пост за допомогою бота, який теж написав сьогодні. До цього пости публікував вручну через додаток Telegram.

Навіщо це потрібно? Є декілька важливих переваг:

• при публікації з бота Телеграм підтримує Markdown; натомість в додатку треба все форматування додавати вручну.
• я хочу в майбутньому дублювати пости на свій сайт

Телеграм-бота створити досить нескладно — для Go є бібліотека, а реєстрація проходить через телеграм-бот @BotFather та займає хвилину.

До того ж для публікації постів потрібен не бот, а просто скрипт. Ідея скрипту проста: для телеграм-каналу створив окремий тип постів (а блог в мене на Hugo); також тримаю файл з відповідністю постів до ідентифікаторів у Telegram. Перед публікацією в Hugo запускаю скрипт, який запостить або оновить пост в Телеграмі, дивлячись на файл відповідностей.

Все б було ідеально, якби Телеграм не вимагав суворого екранування символів для Markdown (наприклад, треба екранувати дефіси та крапки.) Спробую для наступного поста HTML.

📢🖼️📑 Сьогодні рівень “мета” досягає нової відмітки. Цей пост - про статтю про канал.

Бо я покращував інтеграцію цього каналу на сайті. Керування блогом вимагає багато різнопрофільної роботи, через що я раджу взяти готове рішення, а не робити своє. Але ж сам своїй пораді не слухаюсь і самотужки підтримую блог, спираючись тільки на можливості Hugo.

• Додав пейджинацію замість того, щоб показувати всі пости на одній сторінці.
• Додав відображення ілюстрацій до посту. Раніше вони зʼявлялись тільки в телеграмі, бо це не так просто:
• Перевірив, що ілюстрації мають зручний розмір як на великому екрані, так і на маленькому.
• Налаштував шаблон RSS-стрічки для Стендапу, щоб вона відповідала особливостям структури (наприклад, тих самих ілюстрацій).
• Потім, ще й написав статтю з оголошенням, а також більш детальним поясненням, в чому суть цього каналу.

Окрім того, все ще продовжую боротись з SEO та впроваджувати такі очевидні речі, як навігацію по категоріям.

Додав сьогодні заголовки до постів у канал (поки що їх видно тільки на сайті.) Головна причина в пошуковій оптимізації, бо як я зʼясував, якщо єдине, що є в заголовку — це дата, то Гугл такі сторінки не дуже високо оцінює.

Але також заголовок допомагає відразу зрозуміти, про що пост, та, я сподіваюсь, швидше вирішити, що його варто читати. Тому рано чи пізно заголовки зʼявляться і в Телеграмі (як тільки додам цю можливість до мого бота.) На початку я збирався до кожного поста робити ілюстрацію з трьох емоджі, але ця ідея в мене вже вичерпалась.

Є така концепція WOPE (Write Once Post Everywhere). Зміст її в тому, що в наш час закритих платформ (Телеграм, Твіттер, Фейсбук і так далі) має сенс дублювати свій контент на всіх платформах (та, звісно, у відкритому Інтернеті в першу чергу) - так до нього матимуть доступ найбільша кількість споживачів. Тож працюю потрохи в цьому напрямку. З сьогоднішнього Стендапу канал також транслюється у Twitter @stendap_sogodni.

Зрозуміло що для мене, як для інженера, найцікавіша в цьому технологічна складова, тож надсилання в Twitter виконує той самий скрипт, що й в Telegram, а в майбутньому скрипт має розростися в потужний WOPE-комбайн. Трохи специфіки:

• Оскільки Twitter обмежує довжину постів та не надає можливостей форматування, то в нього потраплятиме тільки посилання на пост на сайті. Тут є нюанс: щоб правильно сформувати картку поста, треба мати його “живим”. Це міняє мій підхід, бо поки що я спочатку постив в Телеграм, а вже потім на сайт.

• До того ж скористався нагодою додати на сайт розмітку для карток Twitter. Не знаю, навіщо це робити окремо від тегів OpenGraph, але не тільки Twitter, а й Ahrefs рекомендують це зробити.

• Для авторизації потрібно створити додаток API. Та не забути дозволити йому запис. До речі, для такої простої задачі я б радив використати так звану авторизацію OAuth 1.0a, бо вона не потребує подальшого оновлення ключів. Далі, я знайшов що найпростіший спосіб отримати ключі для користувача — це утилітою twurl; вона генерує посилання на форму дозволу, а далі зберігає ключі в файл, звідки їх можна забрати. Ключі, само собою, не залежать від конкретного клієнта, а тільки від додатка API - тому байдуже, якою утилітою їх отримати.

• Для надсилання повідомлень чудово працює бібліотека github.com/dghubble/go-twitter/twitter; хоч вона й не підтримується більше, але в неї більше всіх зірочок на GitHub. Самому надсилати не хочеться, бо там доведеться будувати підпис.

Як напівтренування, напівкорисне діло захотілося автоматично категоризувати пости в каналі. Автоматично тому, що теми для постів зʼявляються незаплановано, та самому цікаво, в який бік мене несе. Найбільш очевидним алгоритмом є K-means, можна з нього почати, а потім може поекспериментувати з іншими підходами.

Аналіз тексту починається з того, щоб отримати той текст в чистому вигляді. В мене всі пости в Markdown; найпростіше тут взяти парсер Goldmark, який я вже використовую в телеграм-боті, та приписати до нього рендерер, що видає чисто текст без всякої розмітки.

Далі мусимо перетворити кожен пост на послідовність слів, тобто токенізувати. Тут ніби нічого важкого. Застряг я на наступному кроці — стемінгу. Стемінг то відкидання від слова змінної частини, щоб алгоритм не плутався між “слово” та “словом” або “застрягнути” та “застряг”. В кожній мові стемінг свій; до того ж немає “стандартного” стемінгу, бо він не призводить слово до базової форми (це надто складно), а навмання відрізає закінчення. Тут потрібна бібліотека саме для української мови.

Поки що знайшов чудовий ресурс про обробку текстів українською мовою. Також колекцію стемерів. Далі буде.

Хотілося б ретранслювати цей канал в Mastodon, але ж в концепції WOPE (Write once - publish everywhere.) В Телеграм я давно публікую ботом, також весь зміст є на сайті, доведеться й для Mastodon зробити автоматичну публікацію.

В цілому це набагато простіше, ніж з Telegram або з Twitter. У GoToSocial є API, з ним все зрозуміло, працює без сюрпризів. На власному сервері жодних обмежень на довжину поста немає. Навіть в Markdown можна писати.

Але ж мої пости пишуться не просто в Markdown, а містять метадані. Також я використовую особливу розмітку для посилань на пости з каналу. Можна або, як то кажуть, обробити регулярками по-простому, або все ж доведеться розібрати Markdown, перетворити та зібрати назад. Знайшов рендерер саме для цього.

Та друге питання — що робити з ілюстраціями. Наразі вони публікуються в Телеграм окремим постом через особливості відображення постів зі світлиною, які мені не подобаються. В Mastodon можна або робити так само, або обʼєднати в один пост; треба ще поекспериментувати та визначитись. Якщо окремим, можна робити мінітред з двох постів.

Почав з реалізації попереднього перегляду для Telegram, бо тут вже більше коду готово. Виявилося, базовий тестовий скрипт не так вже й складно зробити. Чим воно відразу відрізняється від звичайної функціональності Hugo - замість всього сайту перегляд працює тільки з одним постом. Звісно, того ми й хочемо, але: тоді ще й потрібно щоб користувач обрав пост, над яким працює. (Або ні… є ідеї.)

В основі лежить спостереження за змінами в файлах; випробував новий для мене модуль fsnotify для Go. Він робить приблизно те, що від нього й очікуєш; хіба що не вміє стежити за деревом каталогів — але поки мені взагалі достатньо й одного файлу.

Далі, в тестовому каналі в Telegram створюю порожній пост. (Можна було б навіть брати останній, але технічно простіше створювати новий на кожний запуск скрипту.) Пост можна скільки завгодно редагувати, причому він оновлюється в клієнті наживу, навіть з прокруткою до нового змісту.

Залишається отримувати події про зміни з fsnotify, перемальовувати пост (тобто конвертувати з Markdown в Telegram HTML), та надсилати через API. Обмеження на частоту запитів значення не мають. Єдине, що Telegram не дозволяє надсилати новий зміст такий самий, як наявний. Але то дрібниці.

Певно, найскладнішою частиною було видерти з того скрипту, що вже є, саме промальовку. Бо, уявляєте, там водночас відбувається і промальовка, і валідація, і таке інше. Поки рішення на рівні “накопіпастив та повидаляв зайве”. Взагалі з публікацією в декілька сервісів буде цікаво, бо наразі читання метаданих та конвертація Markdown в HTML логічно спарені.

Поки дуже задоволений, прототип вже спрощує життя.

🏷️ Сьогодні дійшли руки додати до каналу теги - бо постів вже за 800, та регулярно виникає потреба послатися на ту чи іншу серію. Також це допоможе SEO.

Відразу натрапив на проблему. В мене ж пости йдуть на сайт через Hugo та в Телеграм. В Телеграмі теги робляться тривіально: додаєш до слова октоторп та він сам робить посилання на пошук за цим словом. У Hugo система в корні інша: теги належать метаданим поста, а не тексту, та на знаки решітки йому ніяково.

(Тривіальне рішення, певно, це писати тег і в метадані, і в текст, та закрити очі на зайві решітки на сайті. Але хіба це може задовольнити?)

Спочатку хотів зробити якийсь тег-шорткод, на кшталт того що маю для внутрішніх посилань. Це ніби працювало б, але в вихідному коді неохайно (особливо порівняно з хештегом!) та технічно складно.

🚿 Тоді сходив в душ та винайшов елегантне рішення: теги будуть в метаданих, а в тексті я буду автоматично додавати тег до першої згадки слова. Або, коли такої згадки немає, просто в перший рядок. Що й зроблено в цьому пості.

Окрема історія - що в Телеграмі складніше ретроактивно додати теги… якби я це робив вручну. Але оскільки для того є бот, який побачить зміну змісту та відредагує пости, то це можна зробити практично без зусиль… якщо нічого не поламається.

Не так все просто з тегами, як я вчора розповідав. А саме, замінити тег всередині тексту не можна, якщо він вже є посиланням. Ну, наприклад, якщо я вирішив послатися на сторінку Вікіпедії про Go, а також й додав тег Go, то тегом повинна бути друга згадка, а не перша, яка в посиланні.

Іншою особливістю тут є те, що метадані (разом з тегами) є частиною вихідного тексту, а значить, зʼявляються не до, а одночасно з обробкою Markdown. Тому легше за все замінити теги вже в підготованому для Telegram тексті. Який є потворним гібридом HTML та текстової розмітки. Тож доведеться заміняти в HTML.

Як заміняти? Точно не регулярними виразами. Тут потрібний той чи інший парсер HTML. В Go для того є модуль net/html - я про нього вже згадував. Він надає, окрім іншого, токенізатор HTML, тобто спосіб перетворити HTML в послідовність токенів: “тег”, “текст”, “коментар” тощо.

Для такої задачі токенізатор краще, ніж розбір документа в дерево, оскільки дерево нас не цікавить. Нам важливо тільки одне: чи знаходиться текст всередині посилання. Тому заводимо прапорець “чи ми в посиланні” та біжимо по документу.Бачимо токен “відкрити тег A” - вмикаємо прапорець; “закрити тег A” - вимикаємо прапорець. Якщо зустріли токен “текст” та прапорець вимкнений — шукаємо в ньому теги. А решту токенів копіюємо в вихід, як є.

Замість складного обходу дерева чи пошуку батьків — простий прохід з тривіальним скінченним автоматом. Швидко та прозоро.

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

Трохи нюансів. Я хотів теги для каналу окремо від інших розділів сайту. Знайшов, як це роблять, на форумі. Якщо без деталей, то такі теги треба робити окремою таксономією, назвати її stendap/tags - і тільки так, бо ця назва стає шляхом в URL. Але також тепер в метаданих поста теж треба писати "daily/tags", що вже дуже дивно виглядає. Зате результат досягнений.

Хмару тегів в наш час легко зробити з CSS, як ось тут пояснюють. Тільки там кожному тегу призначається клас розміру, а я його обчислюю на ходу з кількості постів. Ще залишається нормалізувати її відносно максимальної, що звучить просто, але в шаблонах Go арифметики немає, а є тільки виклики функцій, та ще й в Польській нотації: font-size:{{add 1 (mul $pageCount $multiplier)}}em.

Ну і ще придумав на сторінці тегу показувати повні пости, але щоб легше було зорієнтуватись, додати також табличку зі змістом. А табличка вже була готова, бо в статтях на сайті вона зʼявляється, коли достатньо заголовків. Тож залишалось тільки адаптувати.

Сьогодні зробив (не без допомоги Claude, зізнаюся) пошук по каналу. Вже кілька років про це думаю, але, знаєте як — пошук це велика задача, ніколи не було часу. А тут за півдня зміг зробити непогану версію, яку можна побачити прямо на сторінці каналу. (Шукайте рядок пошуку.)

Будь-який повнотекстовий пошук спочатку будує індекс, а потім шукає по ньому. Колись в мене на сайті вже був пошук, чисто фронтендовий, через Lunr.js - там індекс сидів прямо в коді скрипту. Втім, це значило, що для пошуку доводилося завантажувати кілька мегабайтів — фактично, весь зміст сайту. Це мені не подобалося. А окрім того, Lunr більше не підтримується.

Тож шукав рішення із бекендом. В Hugo є офіційний перелік, з яких я зупинився на Orama, бо вони обіцяли рішення на чистому JavaScript. (А ще Orama вміє векторизувати запити, що дає можливість шукати по синонімах — але тут поки проблеми.) Нагенерувати базовий код для Orama допоміг Claude, тож не довелося починати з нуля.

Моє рішення складається із чотирьох частин. Спочатку, під час побудови сайту Hugo генерує зміст JSON. Це для мене вже знайомий крок, бо так само працює OmniWOPE.

Потім, теж в скрипті постачі, запускається окремо індексатор. Він перебирає вхідний JSON та генерує величезний (22 Мб!) JSON індексу. Цей файл потрапляє в збірку серверних функцій Vercel.

Далі є функція /search - вона завантажує той індекс з файлу та викликає пошук Orama — це вже досить прямолінійна дія.

Та нарешті, є фронтенд, який теж нагенерував Claude, бо мені не хотілося довго возитися із шаблонами. Фронтенд робить запити до API та виводить список результатів. Попросив Claude “no frameworks, use HTML DOM API” та в цілому отримав те що хотів. Потім додав “use css classes and html tags from post list page”, бо на початку він наробив власних стилів. Якось так.

Поки в цього пошуку є обмеження. Не знайшов, як в Orama мати документи різними мовами — тому поки є тільки українською. Пейджинацію поки не став робити. Але головне — що нарешті закрив навіть власну потребу, бо часто я банально не міг знайти статтю простим пошуком (їх, до речі, тільки-но перевалило за тисячу!). А Google чомусь надзвичайно погано індексує. (Треба і з цим ще помучитись.)

Натрапив на статтю Why I Blog and How I Automate it та відразу сповнився надією — невже можна щось автоматизувати? Виявилося, що автор просто має на увазі публікацію зі статичних файлів… що, прямо скажу, не найскладніша частина процесу.

Але, як все в мене. Як і справжні стендапери (ті, що коміки), я постійно знаходжуся в пошуках матеріалу. Тільки в мене це зазвичай робочі моменти, де застосовуєш якийсь підхід чи правило, які вибиваються з рутини. Наприклад, сказав десь “краще спочатку скопіювати, а потім рефакторити”. А чому я так сказав? Корисно навіть самому собі пояснити, звідки переконання беруться.

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

А далі — залишається написати. В мене раніше була звичка полірувати та розписувати статтю місяцями (зрозуміло, не безперестанно.) Публікувати щодня — це вірний від того порятунок. Знаю, є різні підходи, що спрощують написання — як-от написати план, а потім його послідовно розкривати. Але в мене підхід прямий — писати від початку до кінця. Потім перевірити граматику — та в друк.

З усього цього найскладніше — це помітити матеріал. От якби це автоматизувати…

Сьогодні в мене для вас новини про канал. Нарешті починаю ставитися більш серйозно. Бо, розумієте, до написання статей я завжди ставився серйозно, а до публікації та маркетингу — ні. Через цей дисонанс багато стресу та менше натхнення. Так що, оскільки писати статті гірше я не збираюся, доведеться дотягнути продуктову сторону до відповідного рівня.

Публікувати в цей канал я тепер буду 5 днів на тиждень. Та, скоріше, тематика звужується до більш (чи лише) професійної. Над цим поки думаю.

В мене зʼявляється підписка через Patreon та закритий сервер Discord. Туди переноситься публікація на вихідних. Також планую замість постів робити щось цікавіше як для мене, так і для вас.

(Чому Patreon та Discord? Це доволі типова комбінація, тож довго над цим не думав. Я хотів МоноБазу, але вона змушує привʼязати публікацію до одного з кількох соціальних майданчиків, чого я робити не хочу. Та й інтеграції з Discord там немає. Та й API теж.)

Все це не так легко та швидко налаштувати, як воно мені здавалося. Одна справа — вирішити підняти Патреон, зовсім інша — все в ньому наповнити та продумати.

Такий поки проєкт на вихідний день. :) А тут побачимось в понеділок.