Мой первый пост с интерактивом
Привет! Это первый пост в новом блоге.
Здесь мы используем MDX — это значит, что мы можем писать обычный Markdown, но при этом встраивать настоящие React-компоненты.
Например, вот игра "Бимбо Цвета", которая работает прямо внутри статьи:
bimbo colors
Настоящая девчонка отличит правильный розовый из тысячи похожих. Докажи, что твои глаза — твой главный модный аксессуар!
Круто, правда? Теперь можно делать интерактивные статьи, туториалы и рассказывать истории с помощью кода.
Как это работает?
- Текст пишется в обычном
.mdxфайле - Метаданные (заголовок, дата, теги) задаются в самом начале файла (frontmatter)
- Next.js и
next-mdx-remoteпарсят этот файл и превращают его в HTML + React
Это цитата, чтобы проверить стили Markdown.
А вот список:
- Пункт 1
- Пункт 2
- Пункт 3
Код тоже подсвечивается:
console.log("Hello from MDX!");