Which case convention belongs where
| Convention | Example | Used in |
|---|---|---|
| camelCase | getUserById | JavaScript/TypeScript variables and functions, JSON keys in APIs |
| PascalCase | UserProfile | React components, TypeScript interfaces/types, class names |
| snake_case | user_profile_id | Python variables/functions, PostgreSQL column names, Ruby |
| SCREAMING_SNAKE | MAX_RETRY_COUNT | Constants in most languages, environment variables |
| kebab-case | user-profile | CSS classes, HTML attributes, URL slugs, file names |
| dot.case | app.settings.theme | Config keys (dotenv, properties files), namespace paths |
Why mixing cases causes silent bugs
The most common bug pattern: a REST API returns user_id (snake_case), your frontend code expects userId (camelCase), and the value silently becomes undefined. No error, no warning — just missing data. JavaScript property access is case-sensitive: obj.userId and obj.user_id are different keys.
CSS has the same issue in the opposite direction: className="userProfile" won't match a stylesheet rule for .user-profile. Establish a convention per layer — API responses, database columns, frontend variables, CSS classes — and enforce it with a linter or code review checklist rather than relying on memory.
