Skip to main content

Reusable Components

One of the biggest advantages of MDX is that we can create shared React components for repeated patterns instead of rebuilding them page by page.

Function / API Style Block

ShowcaseVideo
<ShowcaseVideo title="" description="" src="" />

A reusable media component for embedding HTML5 video in a consistent Deltek-branded presentation.

Parameters
  • title: Visible section heading for the embedded media block.
  • description: Supporting copy that explains why the media is included.
  • src: Video source URL.

Returns: A styled media block with a title, description, and embedded video player.

Structured Step Panel

1

Create a shared component

Build the pattern once as a React component instead of repeating custom HTML or ad hoc styling in every page.

2

Use it inside MDX

Import the component into the page and pass only the content that changes.

3

Keep the site consistent

The result is faster authoring, cleaner pages, and a more coherent user experience across products.

Why this matters

  • reduces repeated formatting work
  • keeps patterns consistent across products
  • makes future visual improvements easier
  • supports richer content without forcing every page into custom HTML