Documentation complète

Guide d'utilisation

Apprenez à générer des règles Cursor parfaites pour tous vos projets. Ce guide couvre tout ce que vous devez savoir, des bases aux techniques avancées.

Introduction aux règles Cursor

Les règles Cursor sont des fichiers .mdc (Markdown with Cursor extensions) qui permettent de donner des instructions précises à Cursor sur la façon de générer du code dans votre projet.

Pourquoi utiliser des règles Cursor ?

Code cohérent

Assurez un style de code uniforme dans tout le projet

Gain de temps

Évitez les corrections répétitives et les refactorisations

Bonnes pratiques

Appliquez automatiquement les conventions du projet

Productivité

Cursor comprend mieux votre code et génère des résultats pertinents

Structure d'une règle Cursor

Chaque fichier de règle commence par un frontmatter YAML suivi du contenu en Markdown :

Exemple de structuremarkdown
---
description: Description courte de la règle
globs:
  - "**/*.tsx"
  - "**/*.ts"
alwaysApply: false
---

# Titre de la règle

Instructions détaillées pour Cursor...

## Section 1
- Point 1
- Point 2

## Section 2
```typescript
// Exemple de code
```

description

Description affichée dans Cursor

globs

Patterns de fichiers concernés

alwaysApply

Appliquer à tous les fichiers

Où placer les règles ?

Les règles Cursor doivent être placées dans le dossier .cursor/rules/ à la racine de votre projet :

Structure recommandéeplaintext
mon-projet/
├── .cursor/
│   └── rules/
│       ├── cursor-rules.mdc      # Règle pour créer d'autres règles
│       ├── self-improvement.mdc  # Auto-amélioration
│       ├── project-structure.mdc # Structure du projet
│       ├── tech-stack.mdc        # Technologies utilisées
│       └── react-components.mdc  # Conventions React
├── src/
│   └── ...
└── package.json

Conseil

Créez le dossier .cursor/rules/ manuellement s'il n'existe pas. Cursor le détectera automatiquement.

Démarrage rapide

1Obtenez votre clé API

Pour utiliser les fonctionnalités de génération IA, vous avez besoin d'une clé API :

  1. Rendez-vous sur vibeacademy.eu
  2. Créez un compte ou connectez-vous
  3. Récupérez votre clé API depuis le dashboard
  4. Collez-la dans le champ de connexion de cette application
2Commencez avec les règles fondamentales

Téléchargez les deux règles essentielles qui serviront de base à votre projet :

cursor-rules.mdc

Définit comment Cursor doit créer et formater les nouvelles règles

self-improvement.mdc

Permet à Cursor de créer automatiquement de nouvelles règles basées sur les patterns détectés

3Documentez votre projet

Générez des règles spécifiques à votre projet en utilisant nos outils :

Structure du projet

Documentez l'architecture de vos fichiers

Tech Stack

Analysez vos dépendances et versions

Analyse de fichiers

Extrayez les conventions de votre code

Règles fondamentales

Les règles fondamentales sont le socle de votre système de règles Cursor. Elles doivent être présentes dans chaque projet.

cursor-rules.mdc
Cette règle définit comment Cursor doit créer et formater les nouvelles règles

Quand cette règle est active, Cursor sait :

  • Où placer les nouvelles règles (.cursor/rules/)
  • Comment nommer les fichiers (kebab-case.mdc)
  • Quelle structure utiliser (frontmatter + markdown)
  • Quels globs utiliser pour cibler les fichiers

Quand l'utiliser ?

Cette règle est automatiquement sollicitée quand vous demandez à Cursor de créer une nouvelle règle avec la commande "Add cursor rule".
self-improvement.mdc
Permet à Cursor de créer automatiquement des règles basées sur les patterns détectés

Cette règle "meta" enseigne à Cursor comment s'améliorer en créant de nouvelles règles quand :

  • Un même bug est corrigé plusieurs fois
  • Un pattern de code est répété fréquemment
  • Une convention n'est pas documentée mais utilisée
  • Une erreur courante pourrait être évitée

Inception de règles

Avec cette règle, votre base de règles s'enrichit automatiquement au fur et à mesure que vous codez avec Cursor !

Règles de structure

Les règles de structure documentent l'architecture de votre projet pour que Cursor sache où placer les nouveaux fichiers.

Comment obtenir la structure ?
Terminalbash
# Commande basique
tree

# Exclure node_modules et .git
tree -I 'node_modules|.git|dist|build'

# Limiter la profondeur à 3 niveaux
tree -L 3 -I 'node_modules|.git'

# Afficher uniquement les dossiers
tree -d -L 2

# Exporter dans un fichier
tree -I 'node_modules|.git' > structure.txt

Installation de tree

Si la commande tree n'est pas installée :
• macOS : brew install tree
• Ubuntu : sudo apt install tree
Ce que l'IA analyse

Organisation

Structure des dossiers et hiérarchie

Conventions

Patterns de nommage des fichiers

Séparation

Logique métier vs UI vs utils

Points d'entrée

Fichiers principaux du projet

Évitez le bruit

N'incluez pas les dossiers comme node_modules, .git,dist, build ou les fichiers de cache. Ils ne font qu'alourdir la règle sans apporter de valeur.

Règles tech stack

Les règles tech stack informent Cursor des technologies et versions utilisées pour qu'il génère du code compatible et moderne.

Pourquoi c'est important ?

Sans cette règle, Cursor pourrait générer du code avec :

Class components React

Functional components avec hooks

getInitialProps (Next.js)

App Router avec Server Components

var et callbacks

const/let et async/await

API dépréciées

Dernières API stables

Comment ça fonctionne ?

Collez ou uploadez votre package.json et l'IA analysera :

Framework

Next.js, React, Vue, etc.

UI Libraries

Shadcn, Radix, MUI, etc.

State Management

Zustand, Redux, Jotai, etc.

Validation

Zod, Yup, Joi, etc.

Bonnes pratiques incluses

La règle générée inclut automatiquement les bonnes pratiques spécifiques à chaque version de vos dépendances.

Analyse de fichiers

L'analyseur de fichiers extrait les conventions et patterns de n'importe quel fichier de code bien écrit.

Cas d'utilisation

Composants React

Structure des props, patterns de hooks, styling

Ex: Button.tsx, Card.tsx, Modal.tsx

Utilitaires

Patterns de fonctions pures, typage, exports

Ex: utils.ts, helpers.ts, formatters.ts

API Routes

Gestion des erreurs, validation, réponses

Ex: route.ts, api.ts, handlers.ts

Styles CSS

Conventions de nommage, variables, organisation

Ex: globals.css, theme.css, components.scss

Ce qui est extrait
Conventions de nommage
Structure des imports
Patterns de typage
Gestion des props
Patterns de hooks
Style de code
Documentation
Gestion d'erreurs
Patterns d'export

Conseil pro

Analysez vos fichiers les mieux écrits et utilisez les règles générées comme modèle pour tout nouveau code. Cela standardise automatiquement le style de code dans toute votre équipe.

Bonnes pratiques

Suivez ces recommandations pour tirer le meilleur parti de vos règles Cursor.

À faire
  • Commencez par les règles fondamentales dans chaque projet
  • Documentez la structure dès le début du projet
  • Mettez à jour les règles quand les dépendances changent
  • Créez des règles spécifiques pour les patterns récurrents
  • Utilisez des globs précis pour cibler les bons fichiers
  • Incluez des exemples de code dans vos règles
  • Versionnez vos règles avec Git
  • Partagez les règles entre projets similaires
À éviter
  • Des règles trop longues (>500 lignes) - divisez-les
  • Des instructions vagues ou contradictoires
  • Inclure du code confidentiel dans les règles
  • Des globs trop larges qui s'appliquent partout
  • Dupliquer les mêmes instructions dans plusieurs règles
  • Ignorer les mises à jour après un refactoring
Organisation recommandée
Structure des règlesplaintext
.cursor/
└── rules/
    ├── _meta/
    │   ├── cursor-rules.mdc      # Comment créer des règles
    │   └── self-improvement.mdc  # Auto-amélioration
    │
    ├── _project/
    │   ├── project-structure.mdc # Architecture
    │   └── tech-stack.mdc        # Technologies
    │
    ├── components/
    │   ├── react-components.mdc  # Conventions React
    │   ├── ui-components.mdc     # Composants UI
    │   └── forms.mdc             # Formulaires
    │
    ├── api/
    │   ├── api-routes.mdc        # Routes API
    │   └── data-fetching.mdc     # Récupération de données
    │
    └── styles/
        └── css-conventions.mdc   # Conventions CSS/Tailwind

Questions fréquentes

Combien de règles puis-je avoir ?

Il n'y a pas de limite technique, mais gardez-les organisées. Une dizaine de règles bien structurées est généralement suffisant pour la plupart des projets.

Les règles sont-elles partagées avec mon équipe ?

Oui ! Le dossier .cursor/rules/ est versionné avec Git. Tous les membres de l'équipe bénéficient des mêmes règles automatiquement.

Puis-je utiliser les mêmes règles pour plusieurs projets ?

Absolument. Vous pouvez copier les règles génériques (comme tech-stack.mdc pour React) entre projets similaires et les adapter.

Quelle est la différence entre globs et alwaysApply ?

Les globs définissent des patterns de fichiers (ex: **/*.tsx). alwaysApply: true applique la règle à tous les fichiers, ignorant les globs.

Comment savoir si mes règles fonctionnent ?

Testez en demandant à Cursor de générer du code. Si le code respecte vos conventions, les règles sont actives. Vous pouvez aussi vérifier dans les logs de Cursor.

Puis-je désactiver temporairement une règle ?

Oui, renommez le fichier (ex: my-rule.mdc.disabled) ou déplacez-le hors du dossier rules/. Cursor ne le détectera plus.

Quel modèle IA choisir pour la génération ?

Claude 3.5 Sonnet offre le meilleur équilibre qualité/coût. GPT-4 Turbo est aussi excellent. Pour des tâches simples, Gemini Flash est plus économique.

Besoin d'aide ?

Vous avez d'autres questions ? N'hésitez pas à nous contacter.

Prêt à commencer ?

Générez vos premières règles Cursor et transformez votre expérience de développement.

    Cliquez pour activer le mode débutant !