gitwtfhub

wtf is dumi?

ajuner/dumi — explained in plain English

Analysis updated 2026-08-03 · repo last pushed 2021-03-30

1Audience · developerComplexity · 3/5DormantSetup · moderate

TL;DR

A documentation site generator for React component libraries. It turns your code and Markdown files into a polished docs website with live, interactive component examples, no manual wiring required.

Mindmap

mindmap
  root((repo))
    What it does
      Docs site generator
      Live component demos
      Markdown extensions
      Out of the box
    Tech stack
      React
      Umi framework
      TypeScript
    Use cases
      Document component libraries
      Interactive API references
      Team shared UI docs
    Audience
      React developers
      Component library teams
    Notable users
      ahooks
      Pro Components
      UmiJS

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Why would anyone build with this?

REASON 1

Generate a documentation website for a reusable React component library.

REASON 2

Embed interactive live demos of components directly inside Markdown documentation pages.

REASON 3

Publish API references and usage guides for a shared internal UI component toolkit.

What's in the stack?

ReactUmiTypeScript

How it stacks up

ajuner/dumi0xallam/posthog0xallam/search-engine
Stars111
LanguagePythonC++
Last pushed2021-03-302026-03-262023-08-23
MaintenanceDormantMaintainedDormant
Setup difficultymoderatemoderatehard
Complexity3/53/53/5
Audiencedeveloperpm founderdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you spin it up?

Difficulty · moderate Time to first run · 30min

Requires an existing React component library project and familiarity with Umi-based configuration.

Wtf does this do

dumi is a documentation generator designed specifically for React component libraries. If you're building a collection of reusable React components and need a way to create a polished documentation website, with live examples, usage instructions, and API references, this tool handles that for you so you can focus on writing the code and the docs themselves. The tool works right out of the box, meaning you don't have to spend time wiring together separate pieces for your documentation site. It's built on top of Umi, which is a broader framework for building React applications. One of its standout features is that it extends standard Markdown, the simple text formatting language used for most project documentation, so that you can embed interactive component demos directly within your written docs. You can write a paragraph explaining how a component works, then immediately show a live, working example of that component right on the same page. Teams and individuals building React component libraries are the primary audience. For example, if your team has built a shared set of UI components like buttons, forms, or data tables and you want other developers to understand how to use them, this tool turns your code and Markdown files into a professional documentation site. The README lists several well-known projects that already use it, including ahooks (a popular React hooks library), Pro Components, qiankun, and UmiJS itself, suggesting it's a trusted choice among established React ecosystem projects. The project doesn't go into much detail in the README about specific tradeoffs or architectural decisions, but it does emphasize being "out of the box" ready and extensible. If you want to explore further, the project links to an official site with more examples and a full guide.

Yoink these prompts

Prompt 1
Help me set up dumi for my React component library. I have a folder of reusable components, write the dumi config and a sample Markdown doc page that shows a live demo of one of my buttons.
Prompt 2
I want to embed an interactive React component demo inside a dumi Markdown file. Show me the exact Markdown syntax to render a live, editable example of a form component.
Prompt 3
Compare dumi against Storybook for documenting a React component library. Focus on ease of setup, Markdown-first workflow, and out-of-the-box documentation site generation.

Frequently asked questions

wtf is dumi?

A documentation site generator for React component libraries. It turns your code and Markdown files into a polished docs website with live, interactive component examples, no manual wiring required.

Is dumi actively maintained?

Dormant — no commits in 2+ years (last push 2021-03-30).

How hard is dumi to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is dumi for?

Mainly developer.

View the repo → Decode another repo

This repo across BitVibe Labs

Don't trust strangers blindly. Verify against the repo.