Skip to content

Feature: Add copy as markdown button to docs #3290

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 9 commits into
base: master
Choose a base branch
from

Conversation

DanOnCall
Copy link

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • Docs
  • Other... Please describe:

What is the current behavior?

Issue Number: N/A

Currently, users have no way to easily copy documentation content as clean, portable Markdown. When users want to share or reference NestJS documentation content with LLMs, they must manually copy HTML content or recreate the formatting themselves.

What is the new behavior?

Adds a "Copy as Markdown" button to every documentation page that allows users to copy clean, portable Markdown content to their clipboard. The copied content includes:

  • Clean markdown formatting with NestJS-specific syntax converted to standard markdown
  • Absolute URLs for images and links (so they work when pasted elsewhere)
  • Proper code block formatting with TypeScript/JavaScript examples separated
  • Removed Angular components for cleaner portable content

Features:

  • One-click copy functionality with visual feedback (success/error states)
  • Consistent styling that matches existing documentation design
  • Full accessibility support (ARIA labels, keyboard navigation)
  • Works across all modern browsers with clipboard API support
  • Auto-regenerates content when documentation is updated

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

Implementation approach:

  • Static file generation: Uses Dgeni build system to generate cleaned Markdown files as static assets
  • Production ready: Files regenerated on every build, no runtime performance impact
  • Development friendly: Works with existing npm run build:watch workflow
  • Clean architecture: Follows existing patterns for generated content (like HTML templates)

Technical details:

  • Added OutputCleanMarkdownProcessor to Dgeni pipeline
  • Markdown files generated to src/assets/content/ and gitignored (like existing HTML templates)
  • Copy functionality integrated into BasePageComponent (used by all doc pages)
  • CSS follows existing design system variables and patterns

Browser support: Modern browsers with Clipboard API (Chrome, Firefox, Safari, Edge)

@DanOnCall
Copy link
Author

Howdy @kamilmysliwiec ,

I wanted to contribute to the NestJS docs by adding a copy-as-markdown button. To avoid large bundle sizes or API calls, I'm exploring generating cleaned Markdown files as static assets during the build process that we could use as the source for the copying.

However, I stumbled upon an architectural issue. The feature breaks on pages with routing redirects because the URL path doesn't match the markdown filename. The redirects for the HTML pages are defined at the feature module level.

For example:
URL: /fundamentals/custom-providers
Serves content from: dependency-injection.md

The copy-as-markdown function tries to fetch: /assets/content/fundamentals/custom-providers.md, which results in a 404.

The root cause is that Dgeni generates Markdown files based on original filenames, but Angular routing redirects create different final URLs. There are 6+ routing modules with various redirects.

If you find this feature valuable, I'd happy to get your feedback on what you think could be a good way to get around that challenge. I am thinking perhaps adding redirects that the assets that match the redirects defined in the feature module.

Thank you for your time and insight 🙏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant