Clean Code Guidelines: Formatting JavaScript for Readability and Scale

Code is read far more often than it is written. In collaborative environments, maintaining a consistent syntax formatting policy is critical to minimize code review friction and improve maintainability.

1. Indentation & Spacing Standards

Consistency in basic spacings is the foundation of clear readability:

1. Indent Width: Always use 2 spaces. Avoid mixing tabs and spaces, which causes indentation shifts across different IDE default settings.
2. Line Length: Restrict lines to a maximum of 80 or 120 characters. Long code lines force horizontal scrolling and decrease readability.
3. Bracket Spacing: Add spaces inside curly brackets for destructured variables:

// INCORRECT
import {useState,useEffect} from 'react';

// CORRECT
import { useState, useEffect } from 'react';

2. Naming Conventions

Use semantic casing standards depending on object types:

• camelCase: Standard variables, function names, and properties.
• PascalCase: Class names, React component identifiers, and TypeScript types.
• UPPER_SNAKE_CASE: Global variables, configurations, and environment constants.

3. Automation and Formatters

Instead of arguing styling points during pull request reviews, delegate syntax formatting entirely to automated tools like Prettier or online beautifiers. Formatting scripts clean nesting structures and ensure standard semicolons consistently.