Розробка сайту на MkDocs (документація)

Розробка сайту на MkDocs (документація)

MkDocs — Python-генератор документації з Markdown. Популярен у Python-проектах та DevOps-командах. Material for MkDocs — найповнофункціональна тема з пошуком, версіонуванням та багатомовністю.

Установка

pip install mkdocs mkdocs-material
mkdocs new my-docs
cd my-docs
mkdocs serve

mkdocs.yml

site_name: My Project
site_url: https://docs.myproject.com
repo_url: https://github.com/my-org/my-project
repo_name: my-org/my-project

theme:
  name: material
  language: ru
  palette:
    - scheme: default
      primary: blue
      accent: blue
      toggle:
        icon: material/brightness-7
        name: Темна тема
    - scheme: slate
      primary: blue
      accent: blue
      toggle:
        icon: material/brightness-4
        name: Світла тема
  features:
    - navigation.tabs
    - navigation.tabs.sticky
    - navigation.sections
    - navigation.expand
    - navigation.indexes
    - navigation.top
    - search.highlight
    - search.suggest
    - content.code.copy
    - content.code.annotate
    - content.tabs.link
    - toc.integrate

markdown_extensions:
  - admonition
  - pymdownx.details
  - pymdownx.superfences:
      custom_fences:
        - name: mermaid
          class: mermaid
          format: !!python/name:pymdownx.superfences.fence_code_format
  - pymdownx.tabbed:
      alternate_style: true
  - pymdownx.highlight:
      anchor_linenums: true
  - pymdownx.inlinehilite
  - pymdownx.snippets
  - attr_list
  - md_in_html
  - tables
  - footnotes
  - def_list

plugins:
  - search:
      lang: ru
  - tags
  - git-revision-date-localized:
      type: date
      locale: ru
  - minify:
      minify_html: true

nav:
  - Головна: index.md
  - Руководство:
    - Установка: guide/installation.md
    - Конфигурація: guide/configuration.md
    - Швидкий старт: guide/quickstart.md
  - API:
    - Обзор: api/overview.md
    - Endpoints: api/endpoints.md
  - Changelog: changelog.md

Розширені компоненти Markdown

# Features

!!! tip "Совет"
    Используйте environment variables для хранения секретов.

!!! warning "Внимание"
    Этот метод устарел в версии 2.0.

=== "Python"
    ```python
    import myproject
    client = myproject.Client(api_key="...")
    ```

=== "JavaScript"
    ```javascript
    const client = new MyProject({ apiKey: '...' });
    ```

```mermaid
sequenceDiagram
    Client->>API: POST /auth/login
    API->>Database: Check credentials
    Database-->>API: User found
    API-->>Client: JWT token

### Деплой на GitHub Pages

```yaml
# .github/workflows/docs.yml
name: Deploy Docs
on:
  push:
    branches: [main]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
        with: { fetch-depth: 0 }
      - uses: actions/setup-python@v5
        with: { python-version: '3.x' }
      - run: pip install mkdocs-material mkdocs-git-revision-date-localized
      - run: mkdocs gh-deploy --force

Базовий MkDocs-сайт з Material темою та 20–50 сторінками — 2–4 дні.