Le camelCase est une convention de nommage en programmation qui consiste à écrire plusieurs mots accolés sans espace, en mettant une majuscule à la première lettre de chaque mot — comme les bosses d’un chameau. Le terme vient de l’anglais « camel » (chameau), en référence à l’aspect visuel des majuscules intercalées qui rappellent les bosses de l’animal.
Exemple immédiat : l’expression “nom de variable” s’écrit nomDeVariable ou NomDeVariable en camelCase selon la variante utilisée.
Les 2 types de camelCase
Le terme camelCase regroupe deux variantes distinctes selon la casse du premier mot :
| Variante | Règle | Exemple | Autres noms | Usage principal |
|---|---|---|---|---|
| lowerCamelCase | Premier mot en minuscule, mots suivants en majuscule initiale | nomDeVariablecalculerPrixTotal() | camelBack, casse chameau basse | Variables et fonctions en JavaScript, Java, Kotlin, Swift |
| UpperCamelCase | Tous les mots commencent par une majuscule, y compris le premier | NomDeVariableCalculerPrixTotal() | PascalCase, casse chameau haute | Classes, composants React, types TypeScript, C# |
La différence tient à un seul caractère — la casse de la toute première lettre — mais elle est sémantiquement cruciale dans les langages sensibles à la casse comme Java, JavaScript ou C# : nomDeVariable et NomDeVariable sont deux identifiants distincts.
Exemples de camelCase par langage et contexte
JavaScript — lowerCamelCase pour les variables et fonctions
// lowerCamelCase — convention officielle JavaScript
let nomUtilisateur = "Marie";
let prixTotalHT = 149.90;
let estConnecte = true;
function calculerPrixTotal(prixHT, tauxTVA) {
return prixHT * (1 + tauxTVA);
}
// Propriétés d'objet JSON — lowerCamelCase standard
const commandeClient = {
nomUtilisateur: "Marie Dupont",
montantTotal: 149.90,
estPayee: false
};JavaScript/TypeScript — UpperCamelCase pour les classes et composants React
// UpperCamelCase (PascalCase) — classes JavaScript
class PanierEcommerce {
constructor() {
this.articles = [];
}
}
// UpperCamelCase obligatoire pour les composants React
function ProductCard({ product }) {
return <div className="product-card">{product.name}</div>;
}
// ❌ ERREUR React — composant en lowerCamelCase
function productCard() { } // Traité comme balise HTML, pas comme composantJava — les deux variantes selon le contexte
// lowerCamelCase — variables, méthodes, paramètres
public class CommandeService {
private double prixTotal;
public double calculerPrixTotal(double prixHT, double tauxTVA) {
return prixHT * (1 + tauxTVA);
}
}
// UpperCamelCase (PascalCase) — noms de classes
public class CommandeService { } // UpperCamelCase
public class ArticlePanier { } // UpperCamelCaseC# — UpperCamelCase pour tout ce qui est public (conventions Microsoft)
// C# — UpperCamelCase pour classes, propriétés publiques, méthodes
public class ProfilUtilisateur
{
public string NomUtilisateur { get; set; } // UpperCamelCase
public decimal PrixTotal { get; set; } // UpperCamelCase
public string ObtenirNomComplet() // UpperCamelCase
{
return NomUtilisateur;
}
private string _motDePasse; // lowerCamelCase pour membres privés
}Comparatif des 5 conventions de nommage
| Convention | Exemple | Règle | Langages / contextes principaux |
|---|---|---|---|
| lowerCamelCase | nomUtilisateur | Premier mot en minuscule, suivants en majuscule initiale | JavaScript, TypeScript, Java, Kotlin, Swift — variables et fonctions |
| UpperCamelCase (PascalCase) | NomUtilisateur | Tous les mots commencent par une majuscule | Classes, composants React, types TypeScript, C#, C++ — types et structures |
| kebab-case | nom-utilisateur | Tout en minuscules, tirets comme séparateurs | CSS, HTML, URLs web — ne peut pas être variable JS (tiret = soustraction) |
| snake_case | nom_utilisateur | Tout en minuscules, underscores comme séparateurs | Python, Ruby, SQL, PHP — variables et fonctions |
| SCREAMING_SNAKE_CASE | NOM_UTILISATEUR | Tout en majuscules, underscores | Constantes en Java, C, Python, C# |
camelCase en développement web et e-commerce
Le camelCase est omniprésent dans le développement e-commerce moderne. Quelques contextes spécifiques :
Hooks WooCommerce (PHP)
Les hooks WooCommerce utilisent le snake_case pour les noms d’actions/filtres PHP, mais les variables et méthodes JavaScript des scripts associés utilisent le lowerCamelCase :
// JavaScript e-commerce — lowerCamelCase systématique
const prixProduit = parseFloat(productPrice);
const quantiteSelectionnee = parseInt(selectedQuantity);
const totalPanier = calculerTotalPanier(prixProduit, quantiteSelectionnee);
// Object JS e-commerce — lowerCamelCase pour les propriétés
const articlePanier = {
productId: 42,
nomProduit: "Gourde isotherme 500ml",
prixUnitaire: 24.90,
quantite: 2,
estEnStock: true
};APIs REST et JSON
Les réponses des APIs REST utilisent systématiquement le lowerCamelCase pour les attributs JSON — c’est une convention universelle pour la sérialisation des données entre frontend et backend :
// Réponse API e-commerce — lowerCamelCase standard
{
"orderId": "ORD-2026-001",
"customerName": "Marie Dupont",
"totalAmount": 149.90,
"shippingAddress": "Rue de la Loi 16, 1000 Bruxelles",
"isPaid": true,
"createdAt": "2026-04-01T09:30:00Z"
}Votre site e-commerce ou votre code front-end respecte-t-il les conventions de nommage ?
Des conventions cohérentes (camelCase, kebab-case pour les URLs) impactent la maintenabilité du code et indirectement le SEO technique. Nos équipes interviennent sur des projets WordPress, WooCommerce et React.
Pourquoi utilise-t-on le camelCase ?
- Interdiction des espaces — dans la plupart des langages de programmation, les noms de variables et de fonctions ne peuvent pas contenir d’espaces. Le camelCase est la solution naturelle pour séparer visuellement les mots sans séparateur
- Lisibilité —
nomUtilisateurest bien plus lisible quenomutilisateur. La majuscule marque clairement le début de chaque mot - Convention universelle — le camelCase est adopté dans les guidelines officielles de JavaScript (MDN), Java (Oracle), TypeScript, Kotlin et Swift. Le respecter facilite la collaboration entre développeurs
- Compatibilité JSON — le lowerCamelCase est la convention de facto pour les attributs JSON, ce qui crée une cohérence naturelle entre les APIs REST et le JavaScript qui les consomme
FAQ — camelCase
Qu’est-ce que le camelCase ?
Le camelCase est une convention de nommage en programmation qui consiste à écrire plusieurs mots accolés sans espace, avec une majuscule à la première lettre de chaque mot (sauf parfois le premier). Le nom vient des bosses d’un chameau que rappellent les majuscules intercalées. Il existe deux variantes : le lowerCamelCase (ex : nomUtilisateur) et l’UpperCamelCase ou PascalCase (ex : NomUtilisateur). C’est la convention la plus utilisée dans les langages de programmation modernes.
Quelle différence entre lowerCamelCase et UpperCamelCase ?
La seule différence est la casse du premier mot : lowerCamelCase commence par une minuscule (nomUtilisateur) ; UpperCamelCase (= PascalCase) commence par une majuscule (NomUtilisateur). Dans la pratique : lowerCamelCase pour les variables et fonctions (JavaScript, Java, Kotlin) ; UpperCamelCase pour les classes, types et composants React (JavaScript, TypeScript, C#, Java).
Quand utiliser camelCase en JavaScript ?
En JavaScript : lowerCamelCase pour toutes les variables (let nomUtilisateur), les fonctions (function calculerPrix()), les paramètres et les propriétés d’objets JSON ; UpperCamelCase obligatoire pour les classes (class PanierEcommerce {}) et les composants React (<ProductCard />). React distingue les composants personnalisés des éléments HTML par la casse de la première lettre — <productCard /> en lowerCamelCase est interprété comme une balise HTML inconnue.
CamelCase ou snake_case : quand choisir lequel ?
Cela dépend du langage et du contexte : camelCase est la convention standard pour JavaScript, TypeScript, Java, Kotlin et Swift ; snake_case est la convention standard pour Python, Ruby et SQL. Dans un projet full-stack (Python backend + JavaScript frontend), on utilise généralement snake_case côté serveur et lowerCamelCase côté client, avec une conversion à la frontière API. Dans tous les cas, la cohérence au sein d’un même fichier ou projet est la règle la plus importante.
Pour aller plus loin
- lowerCamelCase — la variante basse, convention JavaScript pour variables et fonctions
- UpperCamelCase — la variante haute, synonyme de PascalCase, pour classes et composants
- PascalCase — terme générique pour UpperCamelCase, utilisé en C#, TypeScript, React
- kebab-case — convention CSS et URLs, incompatible avec JavaScript
- SEO technique — les conventions de nommage impactent les URLs et le code front-end
- Notre expertise e-commerce — développement WordPress et WooCommerce avec des bases de code maintenables
