본문으로 건너뛰기
cccskills
무료GitHub에 공개

clean-code

Write clean, readable, and maintainable code following principles from Robert C. Martin's "Clean Code" and Object Calisthenics. Use when writing, reviewing, or refactoring code to improve naming, function design, formatting, error handling, and class structure. Includes code smell detection and refactoring guidance.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(4)

  • SKILL.md8.3 KB
  • references/CODE_SMELLS.md7.0 KB
  • references/NAMING.md5.8 KB
  • references/OBJECT_CALISTHENICS.md8.3 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Clean Code

Principles for transforming "code that works" into "code that is clean" — code that can be read, understood, and enhanced by any developer.

"Code is clean if it can be understood easily — by everyone on the team." — Dave Thomas

When to Apply

Reference these guidelines when:

  • Writing new code and choosing names, function signatures, structure
  • Reviewing pull requests for readability and maintainability
  • Refactoring legacy code or reducing complexity
  • Identifying and fixing code smells
  • Improving team code standards

Rule Categories

PriorityCategoryImpact
1NamingHIGH — affects every line of code
2FunctionsHIGH — core unit of abstraction
3Code SmellsHIGH — early detection prevents rot
4FormattingMEDIUM — readability at a glance
5Error HandlingMEDIUM — robustness and clarity
6CommentsMEDIUM — most are avoidable
7Object CalisthenicsASPIRATIONAL — exercises for better OO design

1. Naming

Good names are the single most impactful thing you can do for readability.

Priority order:

  1. Consistency — same concept = same name everywhere
  2. Intent-revealing — name says what it does, not how
  3. Specific — avoid vague names like data, info, manager, handler, utils
  4. Searchable — unique enough to grep
  5. Brief — short but not cryptic
// Bad
const d = new Date();
const arr = users.filter((u) => u.a);
function process(data: any) {}

// Good
const createdAt = new Date();
const activeUsers = users.filter((user) => user.isActive);
function validatePayment(payment: Payment) {}

Conventions:

  • Classes/types: nouns (Customer, OrderRepository). Avoid Manager, Data, Info.
  • Methods/functions: verbs (createOrder, validateEmail, isEligible)
  • Booleans: question form (isActive, hasPermission, canWithdraw)
  • Collections: plural nouns (users, orderItems)

See references/NAMING.md for full guidelines.

2. Functions

// Bad — does too many things, unclear name
function handle(order: Order, sendEmail: boolean, log: boolean) {
  // validate, calculate, save, email, log — all in one
}

// Good — small, single-purpose, descriptive
function validateOrder(order: Order): ValidationResult { ... }
function calculateTotal(items: OrderItem[]): Money { ... }
function saveOrder(order: Order): Promise<void> { ... }

Rules:

  • Small — strive for under 20 lines
  • Do one thing — if you use "and" to describe it, split it
  • One level of abstraction — don't mix business logic with low-level details
  • Few arguments — 0-2 ideal, 3+ warrants a parameter object
  • No side effects — or name them explicitly (saveAndNotify, not save)
  • Command/Query separation — a function either does something or returns something, not both

3. Code Smells

Indicators that code may need refactoring. Not bugs, but design friction.

SmellSymptomQuick Fix
Long Method> 20 lines, multiple concernsExtract methods
Large ClassMany responsibilitiesExtract class (SRP)
Long Parameter List> 3 parametersIntroduce parameter object
Primitive ObsessionStrings/numbers for domain conceptsWrap in value objects
Feature EnvyMethod uses another class's data more than its ownMove method
Data ClumpsSame group of fields appear togetherExtract class
Switch StatementsType-checking switch/if-else across codebaseReplace with polymorphism
Divergent ChangeOne class changed for many reasonsSplit by responsibility
Shotgun SurgeryOne change touches many filesMove related code together
Speculative Generality"Just in case" abstractionsDelete (YAGNI)
Dead CodeUnreachable or unused codeDelete
Message Chainsa.getB().getC().doSomething()Hide delegate (Law of Demeter)

See references/CODE_SMELLS.md for detailed examples and refactoring strategies.

4. Formatting

The Newspaper Metaphor — code should read top-to-bottom like a newspaper article. High-level summary at the top, details below.

class OrderProcessor {
  // Public API first — the "headline"
  process(order: Order): ProcessResult {
    this.validate(order);
    const total = this.calculateTotal(order);
    return this.save(order, total);
  }

  // Supporting methods below, in order of appearance
  private validate(order: Order) { ... }
  private calculateTotal(order: Order): Money { ... }
  private save(order: Order, total: Money): ProcessResult { ... }
}

Rules:

  • Related code stays close together (vertical density)
  • Blank lines between concepts (vertical openness)
  • Variables declared near their usage
  • Caller above callee (stepdown rule)
  • Consistent indentation — non-negotiable

5. Error Handling

  • Exceptions over error codes — keeps happy path clean
  • Don't return null — use undefined, Result types, or throw
  • Don't pass null — leads to defensive checks everywhere
  • Fail fast — validate at boundaries, trust internals
  • Specific exceptions — InsufficientFundsError over generic Error
// Bad — null checks cascade through codebase
function getUser(id: string): User | null {
  return db.find(id);
}
const user = getUser(id);
if (user === null) { ... } // Every caller must check

// Good — throw at boundary, trust within domain
function getUser(id: string): User {
  const user = db.find(id);
  if (!user) throw new UserNotFoundError(id);
  return user;
}

6. Comments

"Don't comment bad code — rewrite it."

Most comments compensate for failure to express intent in code. Prefer self-documenting code over comments.

Good comments:

  • Why something is done (business reason, non-obvious decision)
  • Warnings ("this is slow because X", "order matters here")
  • TODOs with context (link to issue)
  • Legal/license headers
  • Public API docs (JSDoc for libraries)

Bad comments:

  • Restating what the code does (// increment counter)
  • Commented-out code (that's what git is for)
  • Journal/changelog comments
  • Noise (// constructor, // getters)
  • Mandated boilerplate
// Bad — restates the obvious
// Check if user is active
if (user.isActive) { ... }

// Good — explains a non-obvious business rule
// Users who haven't verified email within 30 days are auto-deactivated
// per compliance requirement GDPR-2024-42
if (user.isAutoDeactivated) { ... }

7. Object Calisthenics

Nine exercises from Jeff Bay to improve OO design. Treat these as aspirational targets — strict during practice, pragmatic in production.

#RuleGoal
1One level of indentation per methodExtract methods aggressively
2Don't use elseEarly returns, guard clauses, polymorphism
3Wrap all primitives with domain meaningValue objects (Email, Money, UserId)
4First-class collectionsWrap arrays in domain-specific classes
5One dot per lineLaw of Demeter — talk to friends only
6Don't abbreviateIf the name is too long, the class does too much
7Keep entities smallClasses < 50 lines, methods < 10 lines
8Limit instance variablesStrive for 2-3; forces focused classes
9No getters/settersObjects have behavior, not just data

See references/OBJECT_CALISTHENICS.md for examples of each rule.

Implementation Checklist

Before submitting code:

  • Can a new team member understand this without asking questions?
  • Are names intention-revealing and consistent?
  • Does each function do exactly one thing?
  • Are there any code smells I can fix while I'm here?
  • Are comments explaining why, not what?
  • Is error handling clean and specific?
  • Did I leave the code better than I found it? (Boy Scout Rule)

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

fellipeutaka/website122026년 3월 11일 업데이트

Set up and optimize repositories for AI coding agents. Creates minimal AGENTS.md, CLAUDE.md symlink, docs/REQUIREMENTS.md, docs/BUSINESS-RULES.md, feedback loops, and deterministic enforcement (Claude Code hooks, OpenCode plugins). Use when user wants to make a repo AI-friendly, set up AGENTS.md/CLAUDE.md, document requirements/business rules for AI, add pre-commit hooks for AI workflows, or optimize codebase structure for coding agents.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

fellipeutaka/website122026년 3월 11일 업데이트

bun

무료

Bun runtime, package manager, bundler, and test runner. Use when running scripts with bun, managing packages, serving HTTP with Bun.serve, querying databases with Bun.sql/bun:sqlite/Bun.redis, shell scripting with $, using S3/file I/O, writing tests with bun:test, bundling or compiling to executable, or using any Bun-specific API (spawn, glob, semver, FFI, workers, plugins, HTMLRewriter).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

fellipeutaka/website122026년 3월 11일 업데이트

Create high-quality git commits: review/stage intended changes, split into logical commits, and write clear commit messages (including Conventional Commits). Use when the user asks to commit, craft a commit message, stage changes, or split work into multiple commits.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

fellipeutaka/website122026년 3월 11일 업데이트

denji

무료

Manage SVG icons as framework components using Denji CLI. Use when the user needs to add, remove, list, or manage SVG icons in React, Preact, Solid, Qwik, Vue, or Svelte projects. Triggers include requests to "add an icon", "set up icons", "manage SVG icons", "remove an icon", "list icons", or any task involving Iconify icons as framework components.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

fellipeutaka/website122026년 3월 11일 업데이트

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

fellipeutaka/website122026년 3월 11일 업데이트

fellipeutaka의 스킬 모두 보기

이 스킬의 문제 신고