Instructions
When to Use
- Use for MDX/Markdown sanitize + GFM pipelines.
- Prefer
content-creatorfor social copy, not MDX plumbing. - Prefer
skillcodex-browser-uifor the doc browser shell.
Design a markdown/MDX rendering pipeline for docs or blogs in Next.js.
- User-generated content: sanitize HTML; forbid raw
dangerouslySetInnerHTMLwithout allowlist. - GFM: tables, task lists, strikethrough via
remark-gfm. - Syntax highlight: server vs client component for Shiki or prism - pick based on bundle budget.
- Links:
relon external; heading slug plugin alignment with TOC. - Images:
next/imagein MDX wrapper components with dimensions.
Outcomes
- Plugin list + security policy paragraph + component map.
Output Rules
No unbounded HTML pass-through in examples.
Scope and boundaries
- In scope: rendering stack, sanitization, MDX component whitelist.
- Out of scope: full CMS selection, search indexing backend.
Safety
- Read-only; highlight XSS risks if user content is involved.
Troubleshooting
- Hydration on code blocks: split highlighter to client leaf or use static HTML at build time.
- MDX eval: never suggest
evalor arbitrary component mapping from URL params.
Related skills
content-creator- copy before pipelineskillcodex-browser-ui- doc browser renderingsecure-dependencies- sanitizer library risk
GitHub: https://github.com/bh611627/skillcodex/tree/main/skills/markdown-pipeline/SKILL.md
npm: https://www.npmjs.com/package/@skillcodex/skills