인라인 코드와 코드 블록

코드를 표현하는 방법은 두 가지입니다. 문장 중간에 짧은 코드를 넣을 때는 백틱 하나로 감싸는 인라인 코드를, 여러 줄을 보여줄 때는 백틱 세 개로 감싸는 코드 블록을 씁니다.

문장 속 `변수명`처럼 인라인 코드를 씁니다.

```
여러 줄로 된
코드 블록입니다
```

인라인 코드 안에 백틱 자체를 넣어야 한다면, 백틱 두 개로 감싸면 됩니다.

문법 강조(Syntax Highlighting)

코드 블록을 여는 백틱 세 개 바로 뒤에 언어 이름을 적으면, 그 언어 문법에 맞게 색이 입혀집니다. 가독성이 크게 올라갑니다.

```javascript
function greet(name) {
  return `Hello, ${name}!`;
}
```

javascript, python, typescript, java, go, rust, bash, sql, json, html, css 등 수백 가지 언어를 지원합니다. 정확한 언어 이름을 적어야 강조가 제대로 적용됩니다.

자주 쓰는 언어 별칭

  • js → JavaScript, ts → TypeScript
  • py → Python, sh 또는 shell → 셸 스크립트
  • yml → YAML, md → Markdown

터미널 명령어 표기 팁

설치 안내나 실행 방법을 적을 때는 bash 블록을 쓰되, 프롬프트 기호($)는 빼는 것이 좋습니다. 독자가 복사해서 그대로 붙여넣을 수 있기 때문입니다.

```bash
npm install
npm run dev
```

들여쓰기로 만드는 코드 블록

백틱 펜스 외에, 줄 앞에 공백 4칸을 넣어도 코드 블록이 됩니다. 다만 이 방식은 언어를 지정할 수 없어 문법 강조가 적용되지 않습니다. 특별한 이유가 없다면 언어 지정이 가능한 백틱 펜스 방식을 권장합니다.

코드 안에 백틱이 들어갈 때

코드 블록 내용 자체에 백틱 세 개(```)가 포함돼야 한다면, 바깥 펜스를 백틱 네 개 이상으로 감싸면 됩니다. 펜스의 백틱 수가 내용에 든 백틱 수보다 많기만 하면 됩니다. 백틱 대신 물결표(~~~)로 펜스를 만드는 방법도 있습니다.

변경점을 보여주는 diff 강조

코드의 추가·삭제를 강조하려면 언어를 diff로 지정하고, 줄 앞에 +(추가)나 -(삭제)를 붙입니다. 많은 렌더러가 추가 줄은 초록, 삭제 줄은 빨강으로 표시합니다.

```diff
- const x = 1;
+ const x = 2;
```

강조는 렌더러가 담당합니다

문법 강조의 색과 지원 언어는 마크다운 문법이 아니라 이를 렌더링하는 도구가 결정합니다. GitHub은 Linguist, 많은 블로그·정적 사이트는 highlight.js나 Prism 같은 라이브러리를 씁니다. 그래서 같은 코드라도 플랫폼마다 색과 지원 언어, 별칭이 조금씩 다를 수 있습니다.

마무리

코드 블록은 기술 문서의 핵심입니다. 언어를 정확히 지정하는 습관만 들여도 문서의 완성도가 확 올라갑니다. 이지 마크다운 에디터에서 언어별 강조가 어떻게 보이는지 직접 확인해보세요.