dash-documentation-boilerplate — the markdown-driven documentation template every *.2plot.dev component site is forked from. Interactive examples, Dash Mantine Components theming, and first-class AI/LLM and SEO surfaces via dash-improve-my-llms. By Pip Install Python.

Dash Documentation Boilerplate — the 2plot network's template

logo

dash-documentation-boilerplate — the markdown-driven documentation template every *.2plot.dev component site is forked from. By Pip Install Python.

Create beautiful, interactive documentation for your Dash components, data science workflows, and applications with markdown-driven content, live code examples, and automatic theme persistence.

What is This?

The Dash Documentation Boilerplate is a production-ready framework for creating professional documentation sites for your Dash projects. Whether you're documenting a component library, showcasing data visualizations, or building a comprehensive application guide, this boilerplate provides everything you need.

It is also the reference implementation of the 2plot network standard: the site-identity rules, the internal-traffic analytics contract, and the CI baseline that every satellite copies verbatim. Those files are listed on the Network Standard page.

Built With Modern Technologies

Key Features

📝 Markdown-Driven Documentation

Write your documentation in markdown files with full Python integration. The framework automatically discovers markdown files in the docs/ directory and generates pages with:

🎨 Beautiful UI/UX

Built with Dash Mantine Components for a modern, professional look:

🔧 Custom Directives

Powerful directives to enhance your documentation:

🤖 AI/LLM Integration

Powered by dash-improve-my-llms 2.8.0 (the version is read from the installed package, never hardcoded):

🐋 Production Ready

Quick Start

1. Installation

# Clone the repository
git clone https://github.com/pip-install-python/Dash-Documentation-Boilerplate.git
cd Dash-Documentation-Boilerplate

# Install Python dependencies
pip install -r requirements.txt
# markdown2dash pins gunicorn<22 against this project's CVE-driven
# gunicorn>=23 floor, so it installs without its dependency graph.
pip install --no-deps markdown2dash==0.1.2

# Install Node dependencies (for Mantine components)
npm install

2. Run the Development Server

./scripts/dev.sh          # or: python run.py

Visit http://localhost:8559 in your browser.

3. Create Your First Documentation Page

Create a new folder in docs/ with a markdown file:

---
name: My Component
description: Description of my awesome component
endpoint: /components/my-component
icon: mdi:code-tags
---

## My Component

Your documentation content here...

.. toc::

## Features

- Feature 1
- Feature 2

That's it! Your page will automatically appear in the navigation.

Example Documentation

This site includes several example pages to demonstrate the capabilities:

Project Structure

dash-documentation-boilerplate/
├── assets/                      # Static assets and CSS
│   ├── m2d.css                 # Markdown-to-Dash styling
│   └── main.css                # Custom styles
│
├── components/                  # Reusable UI components
│   ├── appshell.py             # Main app layout
│   ├── header.py               # Header with search and theme toggle
│   └── navbar.py               # Navigation sidebar
│
├── docs/                        # Your documentation content
│   └── your-component/
│       ├── component.md        # Markdown documentation
│       └── examples.py         # Python interactive examples
│
├── lib/                         # Utility libraries
│   ├── constants.py            # App-wide constants
│   └── directives/             # Custom markdown directives
│       ├── kwargs.py           # Component props tables
│       ├── source.py           # Source code display
│       └── toc.py              # Table of contents
│
├── pages/                       # Dash multi-page app
│   ├── home.md                 # This home page
│   ├── home.py                 # Home page layout
│   └── markdown.py             # Dynamic markdown loader
│
├── scripts/                     # Post-deploy checks against a live site
├── tests/                       # pytest suite (all three backends)
├── .github/workflows/           # CI and CD
│
├── templates/
│   └── index.html              # Custom HTML template
│
├── CHANGELOG.md                # Version history
├── README.md                   # Full documentation
├── render.yaml                 # Render deployment blueprint
├── requirements.txt            # Python dependencies
├── package.json                # Node dependencies
├── Dockerfile                  # Docker container
└── run.py                      # Application entry point

Customization

Change Primary Color

Edit lib/constants.py:

PRIMARY_COLOR = "teal"  # Change to any Mantine color

Modify Styles

Configure AI/LLM Integration

Update run.py to configure bot management and SEO:

from dash_improve_my_llms import RobotsConfig

app._base_url = "https://your-production-url.com"
app._robots_config = RobotsConfig(
    block_ai_training=True,
    allow_ai_search=True,
    crawl_delay=10
)

Deployment

Docker

# Build the image
docker build -t dash-docs-boilerplate .

# Run the container
docker run -p 8550:8550 dash-docs-boilerplate

Docker Compose

docker-compose up

Visit http://localhost:8550

Resources

Community

License

MIT License - see LICENSE for details.

Ready to start? Check out the example documentation pages to see what you can build!

Note for AI agents: This is the static, prerendered view of an interactive Dash application served because we detected a non-JS user agent. Full prose docs: