Paramétrage GitHub Copilot¶

Ce guide fixe une base commune de paramétrage, pour que tout le monde parte du même pied. Certains réglages sont obligatoires (ils protègent l'intégrité de votre démarche ou l'originalité de votre code), d'autres sont recommandés (ils rendent Copilot plus utile sans risque particulier).

Les principes, peu importe l'interface¶

L'interface de Copilot a changé plusieurs fois depuis la rédaction de ce guide. Elle va changer encore. Ce qui suit reste vrai peu importe le nom des boutons :

1. La complétion en ligne reste active. C'est l'outil de base pour générer par petits incréments.
2. Vos réflexions restent les vôtres. JOURNAL.md et PLANIFICATION.md ne doivent jamais être complétés par l'IA.
3. Vos suggestions ne doivent jamais reproduire du code public sans que vous le sachiez.
4. Un changement de code doit toujours être révisé avant d'être appliqué. Jamais une action autonome et non supervisée sur plusieurs fichiers.
5. Les conventions de votre projet doivent être écrites quelque part que Copilot peut lire, pas seulement dans votre tête.

Le reste de ce guide montre comment appliquer ces principes dans l'interface actuelle. Si ce que vous voyez à l'écran ne correspond plus à ce qui est décrit, le principe reste la référence, pas le nom du bouton.

1. Dans VS Code, panneau Copilot¶

Applique les principes 1 et 2.

Cliquer sur l'icône Copilot en bas à droite de VS Code pour ouvrir ce panneau.

Suggestions inline¶

Fichier html, css, js (n'importe quoi excepté le markdown)¶

Suggestions de prochaine modification (3e case)¶

Markdown¶

2. Sur github.com /settings/ copilot/ features ¶

Applique le principe 3.

3. Le chat Copilot : quel réglage utiliser pour le portfolio¶

Applique le principe 4 : un changement doit toujours être révisé avant d'être appliqué.

Un bouton Default permissions en bas et choisissez l'option Ask when approval settings don't apply afin que rien de ce qui est suggéré ou généré comme code soit automatiquement approuvé sans que vous ne le révisiez vous même.

Ce que vous voyez selon votre poste (labo ou personnel)

4. Le fichier .github/copilot-instructions.md¶

Applique le principe 5.

Un fichier à la racine de votre dépôt, lu automatiquement par Copilot, où vous décrivez les conventions de votre projet. Ça aide Copilot à proposer du code cohérent avec vos choix plutôt que des suggestions génériques.

Gabarit de départ, à adapter à votre projet :

# Instructions pour GitHub Copilot : Portfolio

- Projet en HTML/CSS/JS vanilla, aucun framework.
- HTML sémantique obligatoire (article, section, nav), pas de <div> par défaut.
- CSS organisé par composants\* (un fichier ou un bloc de code par composant).
- Convention de nommage des classes : [ex. BEM\*\*, ou la vôtre].
- Commentaires de code en français.
- Ne jamais suggérer de librairie externe sans que je la demande explicitement.

* Approche par composant pour structurer votre code HTML/CSS/JS

Un bloc de code HTML/CSS/JS qui représente un élément de l'interface (ex. un bouton, un formulaire, une carte d'un projet). Chaque bloc est commenté et séparé des autres pour faciliter la lecture et la maintenance.

Approche par composant

* Nomenclature BEM pour vos classes CSS

Une convention de nommage des classes CSS qui reflète la structure du composant (ex. card__title pour le titre d'une carte).

Nomenclature BEM pour vos classes CSS

5. Gérer vos crédits IA¶

Rejoint le principe 1.

Le plan Copilot Student inclut un nombre de crédits IA limité chaque mois (200, je crois). Une fois épuisés, plus d'accès aux modèles avancés jusqu'au renouvellement.

Interdit / Ne pas faire :

• ❌ « Génère tout mon portfolio »
• ❌ « Réécris entièrement mon fichier CSS »
• ❌ Demander un modèle avancé pour une question simple

À faire :

• ✅ Une fonctionnalité ou un composant à la fois
• ✅ Réutiliser le contexte déjà établi dans la conversation plutôt que de tout réexpliquer
• ✅ Garder le modèle par défaut la majorité du temps, réserver un modèle plus puissant aux cas qui le justifient vraiment

En un coup d'œil¶