Présentation : Customize Chat to Your Workflow

🎯 Sujet

GitHub Copilot dans VS Code - Personnaliser le chat selon votre workflow

Cette présentation couvre les quatre aspects principaux de la personnalisation de GitHub Copilot, illustrés par le REX (Retour d'Expérience) du projet Recif.

📋 Plan de la présentation

1. 📋 Custom Instructions

• Personnaliser le comportement de Copilot
• Définir le contexte du projet Recif
• Configuration des conventions de code

2. 📄 Prompt Files

• Templates réutilisables (.copilot-instructions.md)
• Instructions par répertoire
• Versioning avec Git

3. 💬 Chat Modes

• Chat classique, Inline Chat, Quick Chat
• Utilisation pratique dans le projet
• Raccourcis et commandes

4. 🤖 Language Models

• GPT-4o, GPT-4o mini, o1-preview, o1-mini
• Cas d'usage par modèle
• Stratégie de sélection

🚀 Démonstration REX Recif

• Problème d'authentification OIDC
• Diagnostic avec Copilot
• Résolution guidée étape par étape
• Bilan des gains de productivité

🔮 Aperçu MCP & Tools

• Introduction aux futures fonctionnalités
• Transition vers la présentation du collègue

🚀 Comment lancer la présentation

Option 1 : Ouvrir directement

# Ouvrir le fichier HTML dans votre navigateur
open presentation/index.html

Option 2 : Serveur local (recommandé)

# Avec Python
cd presentation
python -m http.server 8000

# Avec Node.js
cd presentation  
npx serve .

# Avec VS Code Live Server
# Installer l'extension Live Server
# Clic droit sur index.html > "Open with Live Server"

Puis accéder à : http://localhost:8000

🎮 Navigation

• Flèches ou Espace : Navigation entre les slides
• Échap : Vue d'ensemble
• S : Mode speaker notes
• F : Plein écran
• ? : Aide sur les raccourcis

📝 Notes pour le présentateur

Points clés à souligner :

1. Custom Instructions : La base pour contextualiser Copilot
2. Prompt Files : Partage et réutilisabilité des bonnes pratiques
3. Chat Modes : Adaptation de l'interface selon la tâche
4. Language Models : Optimisation des performances selon le contexte

Timing suggéré (30 min total) :

• Introduction + Context Recif : 3 min
• Custom Instructions : 5 min
• Prompt Files : 5 min
• Chat Modes : 5 min
• Language Models : 5 min
• Démonstration REX : 10 min
• Aperçu MCP + Questions : 5 min

Points d'interaction avec l'audience :

• "Qui utilise déjà GitHub Copilot ?"
• "Avez-vous configuré des custom instructions ?"
• "Questions sur la démonstration ?"

🔧 Personnalisation

Modifier le contenu :

Éditer directement le fichier index.html - chaque section est clairement délimitée.

Changer le thème :

Remplacer dans l'en-tête :

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@4.6.0/dist/theme/white.css">

Thèmes disponibles : black, white, league, beige, sky, night, serif, simple, solarized

Ajouter des animations :

Utiliser la classe fragment :

<p class="fragment">Ce texte apparaîtra avec un clic</p>

📊 Structure technique

• Framework : Reveal.js 4.6.0
• Style : CSS personnalisé pour l'identité visuelle
• Plugins : Highlight.js pour la coloration syntaxique
• Responsive : Adapté mobile et desktop

🎨 Éléments visuels

• Couleurs : Palette GitHub (bleus, gris)
• Logo : GitHub Copilot officiel
• Icônes : Emojis pour la lisibilité
• Code : Syntax highlighting pour les exemples

📚 Ressources supplémentaires

• Documentation Reveal.js
• GitHub Copilot Documentation
• Custom Instructions Guide

🤝 Contribution

Pour modifier ou améliorer la présentation :

1. Fork le repository
2. Modifier le fichier presentation/index.html
3. Tester en local
4. Créer une Pull Request

---

Bonne présentation ! 🚀