Génère tes slides avec l'IA grâce à Slidev

date: Dec 10 2025 3 min de lecture

Slidev te permet d'écrire des présentations en Markdown. Combine ça avec l'IA et tu crées tes slides en 1h au lieu de 4.

.devex.ai

Avant je passais 3-4 heures sur une présentation. Ouvrir PowerPoint, galérer avec les layouts, déplacer des boîtes, aligner du texte, chercher des icônes. La moitié du temps passait dans le formatage, pas dans le contenu

Maintenant je génère mes slides avec Claude Code en moins d’une heure. Le secret: Slidev

Slidev en action

Des présentations en code

Slidev c’est un framework de slides pour développeurs. T’écris du Markdown, ça te rend des slides. Pas de drag and drop. Pas de menus à cliquer. Juste du texte

npm init slidev@latest

Une slide c’est juste du Markdown avec des séparateurs ---:

---
theme: default
---

# Ma présentation

Contenu de la première slide

---

## Deuxième slide

- Premier point
- Deuxième point
- Troisième point

C’est tout. Lance slidev et t’as une présentation live dans ton navigateur. Hot reload inclus

Pourquoi c’est parfait pour l’IA

PowerPoint et Google Slides sont des outils visuels. L’IA peut pas cliquer sur des boutons ou déplacer des éléments. Elle peut générer des images, mais tu dois quand même tout assembler à la main

Slidev c’est du texte. Et le texte c’est ce que les LLMs font le mieux

Tu dis à Claude Code “crée une présentation sur l’architecture Kubernetes” et il t’écrit tout. Markdown, blocs de code, diagrammes, d’un coup. Pas besoin de copier-coller depuis ChatGPT vers PowerPoint slide par slide

Des diagrammes Mermaid sans effort

C’est là que ça devient intéressant. Slidev supporte Mermaid nativement

---

## Architecture système

```mermaid {scale: 0.8}
flowchart LR
    A[Client] --> B[Load Balancer]
    B --> C[API Gateway]
    C --> D[Service A]
    C --> E[Service B]
    D --> F[(Database)]
    E --> F
```

Ça te rend un vrai diagramme. Pas de Lucidchart. Pas de draw.io. Pas d’export PNG à placer manuellement

Tu demandes à Claude d’ajouter un diagramme de séquence pour expliquer le flow d’authentification? Il t’écrit le code Mermaid directement. Tu vois le résultat instantanément

sequenceDiagram
    User->>Frontend: Login request
    Frontend->>Auth Service: Validate credentials
    Auth Service->>Database: Check user
    Database-->>Auth Service: User data
    Auth Service-->>Frontend: JWT token
    Frontend-->>User: Authenticated

Des diagrammes complexes qui prendraient 30 minutes à dessiner à la main apparaissent en quelques secondes

Des blocs de code qui claquent

Slidev utilise Shiki pour la coloration syntaxique. Ton code est beau par défaut

## Implémentation

```typescript {lines: true}
async function deployService(config: ServiceConfig) {
  const cluster = await getCluster(config.env)
  await cluster.apply(config.manifest)
  return cluster.waitForReady(config.name)
}
```

Tu peux surligner des lignes spécifiques, afficher les numéros de ligne, même faire du live coding avec l’intégration Monaco. Parfait pour les présentations techniques

Le mode présentateur

Appuie sur P pendant ta présentation et t’as une vue présentateur. Tu vois ta slide actuelle, la slide suivante, tes notes, et un timer. Ton audience ne voit que la slide en cours

T’ajoutes des notes dans ton Markdown:

---

## Architecture Kubernetes

Le contenu de ta slide ici

<!--
Les notes du speaker vont ici.
Rappeler la démo à l'audience.
Mentionner le SLA de 99.9%.
-->

Les notes s’affichent uniquement en mode présentateur. Tu sais quoi dire, l’audience voit des slides propres

C’est standard dans PowerPoint, mais ici c’est juste un commentaire dans ton Markdown. Claude peut générer les notes en même temps que les slides

Mon workflow avec Claude Code

Voilà comment je fais concrètement:

  1. Je crée un nouveau projet Slidev
  2. Je dis à Claude ce que la présentation doit couvrir
  3. Je review les slides générées
  4. Je demande des ajustements, plus de diagrammes, de meilleurs exemples
  5. J’exporte en PDF ou je présente directement

Une présentation technique de 20 slides me prend environ une heure. La plupart du temps c’est de la review et des ajustements, pas de la création from scratch

Les diagrammes Mermaid à eux seuls me font gagner un temps fou. Au lieu de “j’ajouterai un diagramme plus tard” (ce qui n’arrive jamais), j’ai des vrais diagrammes d’architecture, des flowcharts et des diagrammes de séquence dans chaque présentation

Pour commencer

Installe et crée un projet:

npm init slidev@latest my-presentation
cd my-presentation
npm run dev

Édite slides.md. Ajoute ton contenu. Le navigateur se met à jour instantanément

Exporte en PDF quand t’as fini:

npx slidev export

Ou build un site statique à héberger:

npx slidev build

Le vrai bénéfice

Le but c’est pas que l’IA écrive ta présentation à ta place. Tu dois quand même savoir ce que tu veux dire. Tu review tout

Le but c’est d’éliminer la friction. Plus de combat avec les layouts. Plus de chasse aux icônes. Plus de diagrammes à dessiner à la main. Tu te concentres sur le contenu, l’IA gère le formatage

3-4 heures deviennent 1 heure. C’est du temps récupéré pour le vrai boulot

Vous avez aimé cet article ? Partagez-le !

Sofiane Djerbi
Sofiane Djerbi

Architecte Cloud & Kubernetes, Expert FinOps.

Commentaires