Le contexte est roi

Comment fournir les bonnes infos pour obtenir des réponses pertinentes.

3.1L'inventaire du héros

Dans un RPG, ton inventaire détermine ce que tu peux faire. Une épée légendaire ? Tu fais des dégâts massifs. Pas d'armure ? Tu meurs au premier coup. Avec l'IA, c'est pareil : ton contexte, c'est ton inventaire.

Plus ton inventaire est complet (stack, fichiers, conventions, exemples), plus l'IA a de matière pour te donner une réponse précise et utile. Un inventaire vide ? Tu as droit à du loot générique.

3.2Les 5 types de contexte

1. La stack technique

Langage, framework, versions, outils. C'est le minimum vital.

"Next.js 15, App Router, TypeScript 5, Tailwind CSS v4, Zustand pour le state."

2. La structure du projet

Architecture des dossiers, conventions de nommage, patterns utilisés.

"Composants dans components/, kebab-case. Un fichier par composant. Props typées avec interface."

3. Le code existant

Le fichier en cours, les composants liés, les types déjà définis.

"Voici mon type User actuel : [coller le type]. Je veux ajouter la gestion des rôles."

4. Les contraintes

Ce que tu ne veux PAS. Les limites techniques, les choix imposés.

"Pas de librairie externe. Pas de useEffect. Compatible SSR. Doit fonctionner sans JavaScript côté client."

5. Un exemple de référence

Un composant similaire qui marche bien, le style à suivre, un résultat attendu.

"Voici un composant Card qui suit nos conventions : [coller le code]. Fais quelque chose de similaire pour les articles."

3.3Avant / après : la preuve par l'exemple

❌ Prompt sans contextemarkdown

Crée-moi un hook pour gérer un formulaire.

L'IA va inventer une structure de formulaire, choisir un pattern de validation, utiliser peut-être des librairies que tu ne veux pas...

✅ Prompt avec contexte richemarkdown

Tu es un dev React/TypeScript senior.

Mon projet : une app de réservation Next.js 15 avec Tailwind.
J'utilise Zod pour la validation et React Hook Form.

Crée un hook useBookingForm qui :
- Gère les champs : date, heure, nombre de personnes, nom, email
- Valide avec un schéma Zod (date future, email valide, 1-10 personnes)
- Retourne { register, handleSubmit, errors, isSubmitting }
- Gère l'envoi vers /api/bookings en POST

Voici mon schéma Zod actuel pour les users :
```ts
const userSchema = z.object({
  name: z.string().min(2),
  email: z.string().email(),
});
```

Fais quelque chose de cohérent avec ce style.
Format : un seul fichier .ts, types exportés.

3.4L'astuce du fichier de contexte

Une technique puissante : prépare un fichier de contexte pour ton projet. Un document que tu peux copier-coller au début de chaque conversation avec l'IA.

Exemple de fichier de contexte projetmarkdown

# Contexte projet : MonApp

## Stack
- Next.js 15 (App Router)
- TypeScript 5.3 (strict mode)
- Tailwind CSS v4
- Zustand pour le state global
- Zod pour la validation

## Conventions
- Composants : kebab-case, un fichier par composant
- Props : interface nommée [Composant]Props
- Hooks : préfixe use-, fichier séparé
- Pas de default export (sauf pages Next.js)

## Structure
components/
├── ui/        → composants réutilisables (Button, Input...)  
├── features/  → composants métier (BookingCard, UserAvatar...)
└── layout/    → Header, Footer, Sidebar

## Exemples de composants existants
[coller 1-2 composants représentatifs]

Pro tip

Certains outils comme Cursor, Windsurf ou GitHub Copilot permettent de charger ce contexte automatiquement via des fichiers comme .cursorrules ou copilot-instructions.md.

Tu écris le contexte une fois, et chaque interaction avec l'IA en bénéficie. C'est l'équivalent de l'équipement permanent dans un jeu : tu n'as pas besoin de le remettre à chaque combat.

3.5Quand le contexte est "trop" ?

Attention au surcontexte

Oui, trop de contexte peut noyer l'IA. Si tu colles 500 lignes de code pour demander un changement sur 3 lignes, l'IA peut se perdre.

Trop de contexte :

• Coller tout son projet
• Donner des infos sans rapport
• Répéter les mêmes infos

Le bon dosage :

• Le fichier concerné + les types liés
• Les contraintes spécifiques à la tâche
• 1-2 exemples de référence max

À toi de jouer

Crée ton propre fichier de contexte pour un projet sur lequel tu travailles. Utilise le template ci-dessus et remplis chaque section. Tu pourras le réutiliser dans tous tes échanges avec l'IA.