camelCase, snake_case ou kebab-case : lequel utiliser

Choisir entre camelCase, snake_case et kebab-case dépend surtout de l'endroit où vit le nom. JavaScript et Java utilisent le camelCase (firstName), Python, Ruby et SQL le snake_case (first_name), et le CSS, les attributs HTML et les URL le kebab-case (first-name). Suivez la convention du langage et le guide de style de votre équipe. Pour passer un texte d'une casse à l'autre, le Convertisseur de casse gratuit et le Générateur de slug d'URL gratuit font l'essentiel du travail dans votre navigateur.

camelCase, snake_case et kebab-case en un coup d'œil

Style	Exemple	Où on le trouve
camelCase	userFirstName	Variables et fonctions JavaScript et TypeScript, méthodes Java, JSON de nombreuses API web
PascalCase	UserFirstName	Noms de classes dans la plupart des langages, composants React, méthodes C#
snake_case	user_first_name	Variables et fonctions Python, Ruby, noms de colonnes SQL, nombreuses API JSON
SCREAMING_SNAKE_CASE	USER_FIRST_NAME	Constantes dans de nombreux langages, variables d'environnement
kebab-case	user-first-name	Propriétés et noms de classes CSS, attributs HTML, URL, noms de fichiers, options de ligne de commande

Les noms viennent des formes : le camelCase a des bosses de majuscules comme un chameau, le snake_case rampe à plat sur ses tirets bas comme un serpent, et les mots du kebab-case sont embrochés sur des tirets comme une brochette.

Langage par langage

JavaScript et TypeScript. Les variables et fonctions sont en camelCase (getUserName), les classes et composants React en PascalCase (UserCard), et les constantes souvent en SCREAMING_SNAKE_CASE (MAX_RETRIES). Les fonctions intégrées du langage suivent cette règle, comme getElementById et toLowerCase.

Python. Le PEP 8, guide de style de Python, utilise le snake_case pour les fonctions, les variables et les noms de modules, le CapWords (PascalCase) pour les classes, et les majuscules avec tirets bas pour les constantes. Écrire getUserName en Python fonctionne, mais cela détonnera aux yeux de tout développeur Python qui le lira.

CSS et HTML. Les propriétés CSS sont en kebab-case (background-color, font-size), et la plupart des systèmes de nommage de classes font de même (.nav-item, .card-title). Les attributs HTML data- sont aussi en kebab-case, et les navigateurs les convertissent pour JavaScript : data-user-id devient element.dataset.userId. Cette seule ligne résume bien pourquoi les deux conventions existent.

SQL et bases de données. Les noms de colonnes et de tables sont généralement en snake_case (created_at, order_items). Beaucoup de bases de données ramènent les noms non entre guillemets à une seule casse, si bien que createdAt peut discrètement devenir createdat à moins de le mettre entre guillemets à chaque fois. Le snake_case évite ce problème.

URL et noms de fichiers. Utilisez le kebab-case. Les recommandations de Google sur la structure des URL conseillent les tirets plutôt que les tirets bas pour séparer les mots, car les tirets marquent clairement les limites entre les mots. Les minuscules évitent aussi les liens cassés sur les serveurs qui considèrent About.html et about.html comme deux fichiers différents. Voyez ce qu'est un slug d'URL et nos bonnes pratiques pour les slugs d'URL.

JSON et API. Il n'y a pas de règle unique. Beaucoup d'API centrées sur JavaScript utilisent le camelCase, et beaucoup de back-ends Python ou Ruby renvoient du snake_case. Choisissez-en un par API et ne les mélangez jamais dans une même réponse.

Lequel est le plus lisible ?

Les trois sont lisibles une fois qu'on en a l'habitude. Quelques différences pratiques :

• Le snake_case et le kebab-case gardent un espace net entre les mots, ce qui aide pour les noms longs et les sigles (html_parser contre htmlParser contre HTMLParser).
• Le camelCase est plus court et ne demande aucun caractère supplémentaire.
• Le kebab-case ne peut pas servir pour les noms de variables dans la plupart des langages, car user-name se lit comme user moins name.
• Un double-clic sélectionne un nom entier en snake_case ou en camelCase dans la plupart des éditeurs, mais s'arrête généralement aux tirets en kebab-case.

La vraie règle, c'est la cohérence. Un fichier qui mélange userName, user_name et UserName est plus difficile à lire que n'importe quel style utilisé partout.

Convertir d'une casse à l'autre

Vous aurez besoin de convertir quand des données passent d'une couche à l'autre : le created_at d'une API Python qui devient un createdAt en JavaScript, un titre de page qui devient une URL, ou un nom de réglage qui devient une variable d'environnement.

Vers le kebab-case ou le snake_case : utilisez le générateur de slug. Collez les mots, un nom par ligne, et choisissez Tirets (-) pour le kebab-case ou Tirets bas (_) pour le snake_case. Il passe tout en minuscules, transforme les lettres accentuées en lettres simples et supprime les symboles. Il traite tout symbole comme une séparation de mots, donc user_first_name devient user-first-name et inversement. Il ne découpe pas le camelCase en revanche : userFirstName donne userfirstname. Mettez d'abord des espaces entre les mots.

Vers le SCREAMING_SNAKE_CASE. Créez la version snake_case dans le générateur de slug, puis collez-la dans le Convertisseur de casse gratuit et cliquez sur MAJUSCULES. Dans l'autre sens, minuscules transforme MAX_RETRIES en max_retries.

Vers le camelCase ou le PascalCase. Il n'y a pas de bouton en un clic. Le plus rapide : tapez les mots séparés par des espaces, cliquez sur Chaque Mot En Majuscule dans le convertisseur de casse (user first name devient User First Name), puis supprimez les espaces pour le PascalCase et passez la première lettre en minuscule pour le camelCase.

Beaucoup de noms à la fois, dans du code. Pour un renommage d'envergure, utilisez la fonction rechercher-remplacer de votre éditeur avec une expression régulière. Testez d'abord le motif dans le Testeur de regex gratuit : par exemple, _([a-z]) trouve chaque tiret bas suivi d'une lettre, l'endroit où le snake_case aurait besoin d'une majuscule en camelCase. Beaucoup d'éditeurs peuvent mettre en majuscule la lettre capturée dans le remplacement ; consultez la documentation de votre éditeur pour la syntaxe.

Points de vigilance lors de la conversion

• Les sigles. Décidez si c'est userId ou userID, HtmlParser ou HTMLParser, et tenez-vous-y.
• Les nombres. address_line_2 se convertit proprement ; addressLine2 convient aussi ; veillez simplement à ne pas perdre le chiffre.
• Les noms publics. Renommer un champ JSON ou une URL casse tout ce qui les utilise. Ajoutez une redirection pour les URL et gardez les anciens noms de champs fonctionnels un certain temps dans les API.

Convertissez votre texte

Utilisez le Convertisseur de casse gratuit pour les MAJUSCULES, les minuscules et Chaque Mot En Majuscule, et le générateur de slug pour le kebab-case et le snake_case. Les deux tournent dans votre navigateur, et rien de ce que vous collez ne quitte votre appareil.