티스토리 이야기

티스토리 글쓰기 가이드 : 마크다운 문법 본문

가이드

티스토리 글쓰기 가이드 : 마크다운 문법

Joo 2019.03.24 21:36

마크다운은 2004년 존 그루버가 만든 text to HTML 컨버팅 도구입니다. 마크다운을 사용하면 많은 기능을 가지고 있는 에디터가 없어도, 복잡한 HTML 코드 작성없이도 형식을 갖춘 문서를 쉽게 작성할 수 있습니다. 물론 티스토리의 새로운 에디터는 강력한 기능을 가지고 있어 이런 도구가 필요없을지도 모릅니다. 하지만 마크다운은 단순 텍스트라 이력 관리가 쉽고 복사 붙여넣기에도 강점이 있어 티스토리에서는 마크다운 모드를 제공하기로 했습니다.

이제 마크다운으로 어떻게 글을 작성할 수 있을지 알아보도록 하겠습니다.

마크다운 기본 문법

글의 기본인 문단(<p>)은 아무런 기호를 사용하지 않고 작성하면 됩니다. 기본문법은 줄바꿈(<br>)을 사용하기 위해선 특별한 방법을 사용해야 하지만 후에 설명할 Github flavor 문법으로 인해 별다른 방법없이 줄바꿈을 사용할 수 있게 되었습니다.

문단을 나누기 위해서는 두번 줄바꿈을 해주면 됩니다. 이 방법은 작성할 때도 문단이 나뉜 것처럼 보이고 실제로도 문단이 나뉘기 때문에 아주 유용합니다. 문제는 문단 앞뒤 간격이 없도록 설정한 경우 마크다운에서 보는 문단의 모양과 미리보기로 보는 문단의 모양이 다르게 보인다는 것입니다. 따라서 마크다운 모드로 글을 쓰시는 경우 설정에서 문단 앞뒤 간격을 사용하실 것을 권장합니다.

제목(<h1>~<h6>)은 문단 앞에 단계에 해당하는 수의 #을 넣는 것으로 사용할 수 있습니다.

# h1 로 전환

## h2 로 전환

인용(<blockquote>) 은 문단 앞에 >을 넣는 것으로 사용할 수 있습니다. 인용 안에서 줄바꿈이나 문단구분을 사용하려면 새로운 줄 앞에 또 >를 넣어주어야 합니다.

> 인용문입니다.
>
> 인용문 안에서도 새로운 문단을 사용할 수 있고
>
> ## 제목도 사용할 수 있습니다.

리스트는 크게 순서없는 리스트(<ul>), 순서있는 리스트(<ol>) 2가지가 있습니다. 순서 없는 리스트는 -, *, +을 문단 앞에 사용하고 순서 있는 리스트는 1. 등으로 직접 숫자를 사용합니다.

* 섞어 써도 되는
+ 순서가 필요없는
- 리스트 

1. 첫번째
2. 두번째 
3. 세번째를 구분하는 리스트

마크다운에는 폰트를 변경하거나 글자크기를 변경하는 표현식은 없습니다. 강조, 밑줄, 취소 등의 표현만 가능합니다.

**강조** 와 또 다른 _강조_, ~~취소~~

<strong>강조</strong>와 또 다른 <em>강조</em>, <del>취소</del>

링크(<a>) 문서와 문서를 연결하는 HTML에서 가장 중요한 기능 중 하나입니다. 표시할 텍스트와 연결할 URL을 마크다운에서는 다음과 같이 표시합니다.

[티스토리 개발 이야기](https://tistory.io)

<a href="https://tistory.io">티스토리 개발 이야기</a>

테이블(<table>)은 블로그에 작성하는 글에는 그리 유용하진 않지만 일부 사용해야하는 경우가 있습니다. 테이블은 다음과 같이 사용합니다.

| 제목 | 내용 |
| ---- | ---- |
| 첫번째 | 내용입니다. |
| 두번째 | 내용입니다. |

<table>
<thead>
  <tr>
    <th>제목</th>
    <th>내용</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>첫번째</td>
    <td>내용입니다.</td>
  </tr>
  <tr>
    <td>두번째</td>
    <td>내용입니다.</td>
  </tr>
</tbody>
</table>

마지막으로 개발자들이 마크다운을 사랑하는 이유. 코드, 코드 블럭입니다. 이 문서에서도 아주 유용하게 사용 중인데요. `로 감싸면 inline 코드, ```로 감싸면 코드블럭이 됩니다.

    ```kotlin
    fun main(args: Array<String>) {
        println("Hello, world!")
    }
    ```

    <pre><code class="language-kotlin">
    fun main(args: Array<String>) {
        println("Hello, world!")
    }
    </code></pre>

Github Flavor 문법

2004년 존 그루버가 말한 마크다운은 지금과 같이 다양한 기능을 제공하지는 않았습니다. 테이블도 없었고 코드블럭도 들여쓰기를 사용해야만 했습니다. 이로 인해 다양한 확장이 나타났는데요. 티스토리는 가장 활발히 사용되고 있는 Github Flavor Markdown (GFM)을 사용하기로 했습니다. 100% 지원하는 것은 아닙니다. Github에서만 사용되는 것도 있으니까요. 하지만 대부분 지원하려고 노력하고 있으니 자세한 내용은 GFM 문서를 통해 확인해주세요.

감사합니다.

26 Comments
댓글쓰기 폼