Create Sandpack-based interactive code examples for React documentation.
npx skills add https://github.com/reactjs/it.react.dev --skill docs-sandpack
Please help me install this Agent Skill. Skill: docs-sandpack Source: https://github.com/reactjs/it.react.dev/tree/main/.claude/skills/docs-sandpack Command: npx skills add https://github.com/reactjs/it.react.dev --skill docs-sandpack
Use when you want to embed consistent, interactive code examples in React docs using Sandpack patterns, enabling learners to experiment directly in the docs.
Follow the Quick Start to incorporate a Sandpack-driven interactive example into your React documentation page.
High-intent search queries and answers about installing and using this skill.
You can embed interactive code examples in React docs using Sandpack patterns within MDX files, providing structured templates for single-file and multi-file examples. This allows learners to experiment directly in the documentation.
Managing multi-file Sandpack examples in MDX involves using active files for visible code and hidden files for supporting content. This pattern ensures consistent, safe, and reusable documentation components across React docs.
Highlight specific lines in Sandpack code blocks by following established code style and line highlighting guidelines. This ensures consistent presentation of interactive code examples within your React documentation components.
Yes, you can use Sandpack templates without external dependencies by following standardized dependency handling guidelines. This approach ensures safe, reusable, and consistent interactive code examples in your React documentation.
Use hidden files in interactive documentation examples when you need to illustrate concepts safely without cluttering the learner's view. This pattern allows you to separate active visible code from supporting background content.
edyrujaEmbed runnable React code examples in MDX documentation with Sandpack templates.
brainbrewlabsPublishes documentation to GitHub Pages, Vercel, or Netlify from source docs and build outputs.
gil00pitaCombine Markdown with React components to build interactive content.
sauvalaCreate single-file HTML playgrounds for interactive design and code experimentation.
