Про вебсайт

Я завжди хотів собі сайт. Це ж так круто :D І от нарешті ця мрія здійснилась! Хоч він і хоститься на GitHub Pages, мені він все одно дуже подобається. Сподіваюсь колись зможу захостити його деінде, можливо навіть селфхост зробити!

Поки що здебільшого тут текстові версії відео з мого YouTube каналу, але поступово сподіваюсь будуть з'являтись і інші статті.

Технічна сторона

Даний сайт був створений використовуючи Pelican - дуже крутий генератор статичних сайтів, який дозволяє писати статті в форматі Markdown, а потім за одну команду перетворити це все на купку файлів, готових до хостінгу. А наявність купи плагінів під нього дозволяють врахувати різні потреби при створенні сайту. Наприклад в одній з статей мені раптом знадобилось гарно відобразити математичні формули. Я встановив плагін pelican-render-math, і сайт тепер вміє малювати математичні формули!

Щоправда для цього він використовує JavaScript, та CloudFlare в якості CND для цього JavaScript-у. І якщо з першим ще можна якось миритись, то друге мене взагалі не влаштовувало, особливо враховуючи те, як CloudFlare нещодавно впав. Тому за ось цим гайдом я додав весь необхідний JavaScript до свого сайту. Спочатку клонував репозиторій в static директорію теми сайту:

git clone --depth 1 https://github.com/mathjax/MathJax

А потім додав наступне в свій pelicanconf.py:

MATH_JAX = {
        "source": '''"''' + SITEURL + '''/theme/MathJax/es5/tex-chtml-full.js"'''
}

І тепер сайт більше не покладається на сторонні ресурси для малювання математичних формул!

В якості теми була обрана тема Flex. Дана тема була трішки модифікована, для того щоб:

  • був наявний український переклад
  • були наявні кастомні темплейти (сторінка 404, сторінка без дати)
  • теги сортувались по кількості використання цих тегів
  • були наявна пагінація у вигляді кнопок з номерами сторінок внизу
  • плагін featured_image робив клікабельні зображення на головній сторінці.

Для зручності, та щоб не загубити всі ці зміни я зробив окремий форк теми Flex, він доступний за посиланням. Також був написаний додатковий .css файл, для налаштування теми Flex під мої потреби (хоча раз вже зробив форк, можна було б це все і туди додати). Цей .css можна переглянути за посиланням.