The site you're reading is itself the first project. It's a Next.js site where my Obsidian vault is the CMS: create a folder with a main.md and it becomes a page in the sidebar; drop a note into that folder and it becomes a post with its own URL. Hitting save in Obsidian auto-commits to GitHub, Vercel rebuilds, and the change is live in about a minute.
How a note becomes a pageЯк нотатка стає сторінкою
A few decisions I'm happy with:
No database. Content is markdown in git — versioned, portable, free.
Fully static. Every page is pre-rendered at build time, so it's fast and there's nothing to hack at runtime. Fitting, for a future security person.
Pluggable page styles. Each section declares a type (posts, music, people, projects) and the code maps it to a layout — this page is the projects type.
Obsidian syntax works. Wiki links, image embeds with widths, even Apple Music links that turn into players.
Сайт, який ти зараз читаєш, і є першим проєктом. Це сайт на Next.js, де моє сховище Obsidian і є CMS: створюєш папку з main.md — і вона стає сторінкою в бічній панелі; кидаєш нотатку в цю папку — і вона стає дописом із власною адресою. Натискаю «зберегти» в Obsidian, зміни автоматично комітяться в GitHub, Vercel перезбирає сайт, і приблизно за хвилину все вже онлайн.
How a note becomes a pageЯк нотатка стає сторінкою
Кілька рішень, якими я задоволений:
Жодної бази даних. Контент — це markdown у git: версійований, портативний, безкоштовний.
Повністю статичний. Кожна сторінка згенерована наперед під час збірки, тож усе швидко і немає чого зламати в рантаймі. Доречно для майбутнього безпечника.
Змінні стилі сторінок. Кожен розділ оголошує свій type (posts, music, people, projects), а код зіставляє його з макетом — ця сторінка має тип projects.
Синтаксис Obsidian працює. Вікі-посилання, вбудовані зображення із заданою шириною і навіть посилання на Apple Music, які перетворюються на плеєр.
Стек: Next.js 15, Tailwind CSS v4, Obsidian + плагін Git, GitHub, Vercel. Дизайн значною мірою натхненний brianlovin.com.