sinpro.dev
Docs
Dev Environment
Keyboard Shortcuts
  • Company Information
    • Portfolio
    • About
    • Services
    • Events
  • Dev Environment
    • macOS Settings
    • Chrome Extensions
    • VSCode Workspace Settings
    • VSCode Workspace Extensions
    • Global NPM Packages
    • npm-check-updates
    • SvelteKit
    • Customize Zsh
    • ChatGPT Prompts
    • Tailwind CSS
    • Warp
    • Keyboard Shortcuts
  • Assets
    • Assets
    • JPG/PNG to AVIF
    • TTF to WOFF2
  • Clean Code
    • Clean Code
    • Format
    • Quality
    • Variables
    • Functions
    • Objects and Data Structures
    • Classes
    • Concurrency
    • Error handling
    • Comments
  • Code Style
    • TypeScript Config
    • Prettier
    • ESLint
    • Stylelint
  • Testing
    • Vitest
    • Playwright
  • Git
    • Git Branches and Commits
    • Git Hooks
    • Git User Profiles
    • Git for Windows
  • GitHub
    • GitHub Issues
    • GitHub Pull Requests
    • GitHub Repository Settings
    • GitHub Branch Protection
    • GitHub Actions
  • Code Quality
    • SonarCloud Coverage
  • Server
    • SSH
    • PM2
    • Caddy
    • Updating the server
    • ngrok
  • Team sinProject
    • Our Team Policy
    • Equipment and Supplies
    • Books
    • Slack
    • Locales
    • Funny Apps
    • Docs History
  • Talk
    • Talk
    • Creating a Project
    • App Structure

Clean Code

Variables

Edit this page

Prefer const

Require const declarations for variables that are never reassigned after declared.

BAD
let a = 3
console.log(a)
GOOD
const a = 3
console.log(a)

Use meaningful and pronounceable variable names

Bad
const yyyymmdstr = moment().format('YYYY/MM/DD')
Good
const formatted_current_date = moment().format('YYYY/MM/DD')

Use searchable names

Bad
// What the heck is 86400000 for?
setTimeout(restart, 86400000)
Good
// Declare them as capitalized named constants.
const milliseconds_per_day = 60 * 60 * 24 * 1000 //86400000

setTimeout(restart, milliseconds_per_day)

Use explanatory variables

Bad
const user_map: Map<string, User>

for (const key_value of user_map) {
	// ...
}
Good
const user_map: Map<string, User>

for (const [id, user] of user_map) {
	// ...
}

Avoid Mental Mapping

Bad
const c = get_count()
const u = get_user()
Good
const count = get_count()
const user = get_user()

Don’t add unneeded context

Bad
const Car = {
  car_make: "Honda",
  car_model: "Accord",
  car_color: "Blue"
}

function paint_car(car: Car, color: string): void {
  car.car_color = color
}
Good
const Car = {
  make: "Honda",
  model: "Accord",
  color: "Blue"
}

function paint_car(car: Car, color: string): void {
  car.color = color
}

Use default parameters instead of short circuiting or conditionals

Bad
function load_pages(count?: number) {
  const load_count = count ?? 10
  // ...
}
Good
function load_pages(count: number = 10) {
  // ...
}

Use enum to document the intent

Bad
const GENRE = {
  ROMANTIC: 'romantic',
  DRAMA: 'drama',
  COMEDY: 'comedy',
  DOCUMENTARY: 'documentary',
}
Good
enum genre {
  romantic,
  drama,
  comedy,
  documentary,
}
Quality Functions
© sinProject. v0.73.0
On this page
  • Variables
  • Prefer const
  • Use meaningful and pronounceable variable names
  • Use searchable names
  • Use explanatory variables
  • Avoid Mental Mapping
  • Don’t add unneeded context
  • Use default parameters instead of short circuiting or conditionals
  • Use enum to document the intent