BaliseTonSite

Le contexte est roi

80% de la qualité d'une réponse IA dépend du contexte fourni.

3.1Pourquoi le contexte change tout

Un modèle de langage ne connaît rien de ton projet. Il ne sait pas ta stack, tes conventions, ta structure de fichiers, ton niveau, ni ce que tu as déjà essayé. Sans contexte, il devine, et il devine souvent mal.

Sans contexte

"Comment faire un formulaire de login ?"

→ L'IA te donne un formulaire HTML basique avec du CSS inline. Rien à voir avec ton projet Next.js + Tailwind + Zod.

Avec contexte

"Crée un formulaire de login dans mon projet Next.js 15 avec App Router. J'utilise React Hook Form + Zod, Tailwind CSS, et les Server Actions. L'auth est gérée par cookies WordPress."

→ L'IA produit exactement ce dont tu as besoin, compatible avec ton architecture.

3.2Les 4 couches de contexte

Couche 1 : Le Projet

Stack, architecture, structure de fichiers, conventions.

"Projet Next.js 15, App Router, TypeScript, Tailwind v4, PostgreSQL."

Couche 2 : La Tâche

Ce que tu veux faire, pourquoi, quelles contraintes.

"Je veux créer un composant de pagination. Il doit gérer + de 1000 items. Il reçoit totalItems et itemsPerPage en props."

Couche 3 : Le Code existant

Les fichiers liés, les interfaces, les imports déjà en place.

"Voici mon interface User et mon hook useAuth existant : [code]"

Couche 4 : Les Préférences

Ton style de code, tes conventions, ce que tu veux et ne veux pas.

"Pas de any en TypeScript. Utilise cn() pour les classes conditionnelles. Composants en kebab-case."

3.3Les fichiers d'instructions

Les meilleurs outils IA supportent des fichiers d'instructions persistantes. Un seul fichier bien écrit peut transformer toutes tes interactions :

Bashbash
# Les fichiers d'instructions selon l'outil
.cursorrules           # Cursor IDE
.github/copilot-instructions.md  # GitHub Copilot
CLAUDE.md              # Claude Code (terminal)
.clinerules            # Cline (extension VS Code)
.windsurfrules         # Windsurf IDE
Bashbash
# Exemple de structure d'un fichier d'instructions

## Projet
BaliseTonSite - plateforme SaaS d'apprentissage web
Stack : Next.js 15, React 19, TypeScript, Tailwind CSS v4

## Architecture
- App Router (pas de /pages)
- Server Components par défaut
- Composants dans components/, organisés par feature

## Conventions
- Fichiers en kebab-case.tsx
- Interfaces pour les props de composants
- Pas de "any" en TypeScript (sauf exception justifiée)
- Utiliser cn() pour les classes Tailwind conditionnelles

## Ton
- Bienveillant et déculpabilisant
- Langage simple, pas de jargon intimidant
- Analogies concrètes pour les concepts abstraits

3.4La technique du "few-shot"

Donner un exemple de ce que tu attends vaut 1000 mots d'explication. C'est le "few-shot prompting" :

Exemple concret

Au lieu de : "Crée des composants de cours"

Dis plutôt :

"Crée le chapitre 3 du cours React en suivant exactement le pattern du chapitre 2 que voici :

[colle le code du Chapter2.tsx]

Le chapitre 3 couvre le State et les événements. Garde le même ton déculpabilisant, les mêmes composants (SectionIntro, IntroBox, CodeBlock, InfoBox), et le gradient from-cyan-600 to-blue-800."

3.5Trop de contexte vs pas assez

📉

Pas assez de contexte

L'IA invente des choix. Elle utilise React Class Components au lieu de hooks. Elle met du CSS-in-JS alors que tu utilises Tailwind. Elle crée des types any partout.

📈

Trop de contexte

L'IA se noie dans l'information. Elle confond les fichiers, mélange les conventions, et produit des réponses incohérentes. Fenêtre de contexte saturée.

Le bon équilibre

Le contexte pertinent pour la tâche en cours. Pas tout le projet, mais les fichiers liés, les conventions locales, un exemple du pattern attendu.

3.6Template de contexte

Checklist contexte (à réutiliser)

Stack : langages, frameworks, versions
Tâche : quoi, pourquoi, contraintes
Code existant : fichiers liés, interfaces, types
Exemple : un fichier similaire comme modèle (few-shot)
Conventions : nommage, structure, style
Ce que tu ne veux PAS : anti-patterns, solutions indésirables

Verifie tes acquis

5 questions pour valider ce chapitre

1. Pourquoi le contexte améliore-t-il drastiquement les réponses de l'IA ?

Valide et sauvegarde ce chapitre

Ne perds pas le fil de ton apprentissage. Chaque QCM terminé sauvegarde ton score. Crée ton profil gratuitement pour débloquer toutes les évaluations du site et retrouver tes résultats plus tard.

Commencer l'aventure
Déjà membre ?Connecte-toi