🔍 Введение

Парсинг Markdown и MDX поддерживается через unified, а также другие пакеты remark и rehype. next-mdx-remote позволяет нам парсить файлы .mdx и .md более гибко без необходимости изменять webpack.

Используется GitHub flavored markdown. mdx-prism предоставляет возможности подсветки синтаксиса для блоков кода. Вот демонстрация того, как всё это выглядит.

Следующая шпаргалка по Markdown адаптирована из: Mastering Markdown

❓ Что такое Markdown?

Markdown — это способ стилизации текста в интернете. Вы управляете отображением документа: форматирование текста как жирного или курсива, добавление изображений и создание списков — это лишь несколько вещей, которые можно делать с помощью Markdown. В основном, Markdown — это обычный текст с несколькими неалфавитными символами, такими как # или *.

📚 Справочник по синтаксису

Вот обзор синтаксиса Markdown, который вы можете использовать где угодно на GitHub.com или в своих текстовых файлах.

📌 Заголовки

# Это тег h1

## Это тег h2

#### Это тег h4

Это тег h1

Это тег h2

Это тег h4

✨ Выделение текста

_Этот текст будет курсивом_

**Этот текст будет жирным**

_Вы **можете** комбинировать их_

Этот текст будет курсивом

Этот текст будет жирным

Вы можете комбинировать их

📋 Списки

Неупорядоченный список

- Элемент 1
- Элемент 2
- Элемент 2a
- Элемент 2b

• Элемент 1
• Элемент 2
• Элемент 2a
• Элемент 2b

Упорядоченный список

1. Элемент 1
1. Элемент 2
1. Элемент 3
1. Элемент 3a
1. Элемент 3b

1. Элемент 1
2. Элемент 2
3. Элемент 3
4. Элемент 3a
5. Элемент 3b

🖼️ Изображения

![Логотип GitHub](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
Формат: ![Альтернативный текст](URL)

🔗 Ссылки

http://github.com - автоматически!
[GitHub](http://github.com)

http://github.com - автоматически! GitHub

💬 Цитаты

Как сказал Канье Уэст:

> Мы живём в будущем, поэтому
> настоящее — это наше прошлое.

Как сказал Канье Уэст:

Мы живём в будущем, поэтому настоящее — это наше прошлое.

</> Встроенный код

Я думаю, вам следует использовать
здесь элемент `<addr>`.

Я думаю, вам следует использовать здесь элемент <addr>.

🌈 Подсветка синтаксиса

Вот пример того, как можно использовать подсветку синтаксиса с GitHub Flavored Markdown:

```js:fancyAlert.js
function fancyAlert(arg) {
  if (arg) {
    $.facebox({ div: '#foo' })
  }
}
```

И вот как это выглядит — с красивой подсветкой и стилизованными заголовками кода!

function fancyAlert(arg) {
  if (arg) {
    $.facebox({ div: '#foo' })
  }
}

📝 Сноски

Вот простая сноска[^1]. И немного текста после неё.

[^1]: Моя сноска.

Вот простая сноска¹. И немного текста после неё.

✅ Списки дел

- [x] Требуется синтаксис списка (поддерживается любой маркированный или нумерованный список)
- [x] это выполненный пункт
- [ ] это невыполненный пункт

• Требуется синтаксис списка (поддерживается любой маркированный или нумерованный список)
• это выполненный пункт
• это невыполненный пункт

📊 Таблицы

Вы можете создавать таблицы, собирая список слов и разделяя их дефисами - (для первой строки), а затем разделяя каждый столбец вертикальной чертой |:

| Первый заголовок | Второй заголовок |
| ---------------- | ---------------- |
| Содержимое ячейки 1 | Содержимое ячейки 2 |
| Содержимое в первом столбце | Содержимое во втором столбце |

🗑️ Зачёркнутый текст

Любое слово, обёрнутое в две тильды (например, ~~это~~), будет отображаться зачёркнутым.