Skip to main content
Back to Blog

Mastering Text Cases: Camel, Snake, and Kebab Explained

A clear map of which case to use in JavaScript, Python, CSS, URLs, and configs—and how to convert between them.

Kashyap Thakar
8 min
ProgrammingBest PracticesClean Code
Mastering Text Cases: Camel, Snake, and Kebab Explained

There are only two hard things in Computer Science: cache invalidation and naming things. While we can't help with your cache headers, we can certainly help with the syntax of your names. Choosing the right naming convention is crucial for code readability and maintainability.

The Big Three: A Detailed Breakdown

1. camelCase (lowerCamelCase)

The first letter is lowercase, and each subsequent word starts with an uppercase letter. There are no spaces or punctuation.

myVariableName, getUserById, limit

Where you'll see it: JavaScript/TypeScript variables and functions, Java methods, Swift, Go (private members).

2. snake_case

All letters are lowercase, and words are separated by underscores. It's often praised for its readability as the underscore mimics a space.

my_variable_name, get_user_by_id, limit_count

Where you'll see it: Python variables and functions, Ruby, PHP, SQL database column and table names, Rust.

3. kebab-case (dash-case)

All letters are lowercase, separated by hyphens (dashes). It looks like a skewer through meat, hence "kebab".

my-variable-name, submit-button, main-header

Where you'll see it: CSS class names (`.btn-primary`), HTML attributes (`data-user-id`), URL slugs (`/blog/my-first-post`), Kubernetes YAML keys.

Specialized Conventions

  • PascalCase (UpperCamelCase): Like camelCase, but the first letter is also capitalized.
    Usage: Classes in almost all languages (Java, JS, Python), React Components (`MyButton`), TypeScript Interfaces.
  • SCREAMING_SNAKE_CASE: All uppercase with underscores.
    Usage: Constants, Environment Variables (`API_KEY`, `MAX_RETRIES`).
  • Train-Case (HTTP-Header-Case): Each word capitalized, separated by hyphens.
    Usage: HTTP Headers (`Content-Type`, `Cache-Control`).

The Friction of Crossing Boundaries

The biggest headache arises when moving data between systems with different opinions.
For example, a PostgreSQL database (snake_case) sends data to a Node.js API (camelCase), which sends JSON to a frontend (camelCase) that styles it with CSS (kebab-case).

// DB Row
{ "user_first_name": "Alice" }

// Desired JS Object
{ userFirstName: "Alice" }

Edge Cases and Special Considerations

Acronyms and Abbreviations

How should acronyms be handled? Different teams have different preferences:

  • Preserve case: XMLHttpRequest stays as-is
  • All caps: XMLHTTPRequest or XML_HTTP_REQUEST
  • Treat as words: XmlHttpRequest or xml_http_request

Consistency matters more than the specific choice. Document your team's preference.

Numbers in Names

Numbers are typically preserved as-is:

user2Name, api_v2_endpoint, component-3

Special Characters

Most naming conventions don't allow spaces or special characters. When converting:

  • Spaces become delimiters (underscores, hyphens, or camelCase breaks)
  • Special characters are typically removed or replaced
  • Unicode characters may need normalization

Conversion Strategies

Database to Code

Converting SQL column names to code variables:

-- SQL
user_first_name, created_at, is_active

// JavaScript/TypeScript
userFirstName, createdAt, isActive

// Python
user_first_name, created_at, is_active

API Response Transformation

Converting API response keys to match your frontend conventions:

// API Response (snake_case)
{ "user_id": 123, "full_name": "Alice" }

// Frontend (camelCase)
{ userId: 123, fullName: "Alice" }

Best Practices

  • Be consistent: Pick one style per project and enforce it with linters
  • Follow language conventions: Use the style your language community expects
  • Document exceptions: If you must deviate, explain why
  • Use automated tools: Don't convert manually - use tools to ensure accuracy
  • Consider readability: Some styles are more readable for certain use cases

Automating the Switch

Manual refactoring is asking for typos. If you have a list of SQL columns to convert to TypeScript interfaces, or a list of constants to format, don't retype them. Manual conversion leads to:

  • Typos and inconsistencies
  • Time wasted on repetitive tasks
  • Errors that are hard to catch
  • Inconsistent formatting across the codebase

Use our Text Case Converter to instantly transform text between these formats. It handles:

  • All major naming conventions (camelCase, snake_case, kebab-case, PascalCase, SCREAMING_SNAKE_CASE, etc.)
  • Edge cases like acronyms and numbers
  • Bulk conversion of multiple identifiers
  • Consistency across your entire stack

Perfect for refactoring, generating TypeScript interfaces from SQL schemas, converting API response keys, or standardizing naming across your codebase. Save time and ensure accuracy.

Part of the ThenCatch blog. Learn more about us or browse more guides.