Skip to main content

Advanced Patterns

This page shows the kinds of things that become possible when documentation is treated as a real web experience rather than only as static text.

Interactive React Example

This block uses React state inside the documentation page to filter a small list of feature examples.

  • Details / Accordionscontent
  • Embedded Videomedia
  • Function Signature Blockscomponents
  • Interactive React Examplescomponents
  • Tabs and Calloutscontent

Comparison Cards​

Baseline

Plain Markdown

Fast and effective for straightforward task topics and reference pages.
Best when the content pattern is simple and repeated.
Recommended

MDX with Shared Components

Adds reusable visual patterns and richer layouts while keeping authoring manageable.
Best for modern help experiences with repeated feature blocks.
Advanced

Heavier React Interaction

Useful when the page itself becomes an explainer or guided experience, not just a static topic.
Best used selectively so the docs do not become overengineered.

Practical limits​

Use selectively

The fact that MDX can do more does not mean every help topic should become interactive. Most production help should still stay straightforward, fast, and easy to maintain.

Where advanced patterns may fit​

  • guided product overviews
  • richer onboarding pages
  • embedded comparison or decision pages
  • content marketing / product education crossover pages