skills.rest
claude-office-skills
claude-office-skillsOFFICIAL
Explore all skills by this author →
GitHub

dev-slides

Generate Slidev presentations with Markdown, Monaco Editor, Mermaid, and Vue components.

368|75|Updated Jan 29, 2026
Search Tags:#markdown#presentation#slides#developer#slidev#code demo
One-click install
npx skills add https://github.com/claude-office-skills/skills --skill dev-slides
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: dev-slides
Source: https://github.com/claude-office-skills/skills/tree/main/dev-slides
Command: npx skills add https://github.com/claude-office-skills/skills --skill dev-slides

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill simplifies the creation of technical presentations for developers by leveraging the Slidev framework, allowing for Markdown-based slide creation with live code and interactive elements.

Core Features & Use Cases

  • Markdown-based Slides: Write presentations in familiar Markdown syntax.
  • Live Code Demos: Embed and run code directly within slides using Monaco Editor.
  • Diagrams & Components: Integrate Mermaid diagrams and Vue components for rich content.
  • Use Case: Generate a presentation for a new API feature, including code examples and architectural diagrams, ready for a developer team meeting.

Quick Start

Describe your technical presentation needs and I'll generate Slidev markdown.

Frequently Asked Questions about dev-slides

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create developer presentations using Markdown?▼

To create developer presentations using Markdown, this skill generates Slidev framework files, enabling Markdown-based slide creation with live code execution via Monaco Editor, Mermaid diagrams, and Vue components.

Can I run live code demos directly within my slides?▼

Yes, you can run live code demos directly within slides. This skill leverages the Slidev framework to embed and execute code using the Monaco Editor for interactive technical talks and workshops.

Does Slidev support integrating Mermaid diagrams and Vue components?▼

Slidev supports integrating Mermaid diagrams and Vue components. This skill generates presentations that combine Markdown syntax with these rich content elements for developer onboarding materials.

What is the best way to build a technical presentation for an API feature?▼

The best way to build a technical presentation for an API feature is using Slidev. This skill generates Markdown slides with embedded code examples and architectural diagrams, ready for developer team meetings.

Do I need Vue knowledge to use Slidev for presentations?▼

You do not need Vue knowledge to use Slidev for presentations. This skill handles the generation of Markdown-based slides, allowing you to leverage Vue components and Monaco Editor for live code without manual coding.

Related Skills

Explore More Software Engineering Skills→
hmzainjamilhmzainjamil
1

dev-slides

Generate Slidev markdown presentations with code examples, diagrams, and Vue components.

Community
Intermediate
yulonglinyulonglin
11

slidev

Create Slidev presentations and export them to PDF from slides.md.

Community
Intermediate
yoanbernabeuyoanbernabeu
34

slidev-monaco-editor

Integrates Monaco Editor into Slidev for interactive live coding blocks with TypeScript or JavaScript.

Community
Advanced
whichguywhichguy

html-artifact

Generate self-contained HTML files from Markdown content.

Community
Intermediate