마크다운(Markdown): 개념, 장점 및 주요 문법 요약 정리

마크다운(Markdown): 개념, 장점 및 주요 문법 요약정리

마크다운(Markdown)은 가볍고 간편한 문법으로 텍스트를 서식 있게 작성할 수 있는 표기법입니다. HTML과 비교해 학습이 쉽고 가독성이 높으며, 다양한 플랫폼에서 호환되는 장점을 가지고 있습니다. 이번 글에서는 마크다운의 기본 개념, 장점 및 문법에 대해서 알아보겠습니다.

1. 마크다운(Markdown) 이란

마크다운(Markdown)은 텍스트 기반의 마크업 언어로 간결한 문법을 사용하여 텍스트를 구조화하고 서식을 적용할 수 있습니다. 2004년에 존 그루버(John Gruber)와 아론 스워츠(Aaron Swartz)에 의해 개발되었습니다. 마크다운의 주요 목적은 웹 상에서 가독성을 높이고 쉽게 글을 작성할 수 있도록 돕는 것입니다. 일반 텍스트로 작성되었지만 HTML로 변환하여 웹페이지에 사용할 수도 있습니다.

2. 마크다운의 장점

마크다운은 아래와 같은 장점으로 꾸준히 널리 사용되고 있는 언어입니다.

  • 간결한 문법: 마크다운의 문법은 간단하고 직관적이어서 빠르게 배울 수 있으며 사용하기 쉽습니다. 특별한 툴 없이도 텍스트 에디터에서 작성할 수 있습니다.
  • 높은 가독성: 마크다운 문서는 서식이 적용되지 않은 상태에서도 읽기 쉽게 구조화되어 있습니다. 따라서 원본 텍스트를 읽거나 편집할 때 가독성이 높습니다.
  • 다양한 플랫폼 호환성: 마크다운 문서는 다양한 플랫폼에서 쉽게 열람할 수 있고 HTML이나 PDF 등 다른 형식으로 변환할 수도 있습니다.
  • 버전 관리 용이: 텍스트 기반으로 작성되기 때문에 Git 같은 버전 관리 시스템과 호환성이 좋습니다. 변경 사항을 추적하고 이전 버전으로 되돌릴 수 있어 협업에도 유용합니다.

3. 마크다운 문법

3.1. 헤더(Headers)

마크다운에서 헤더는 텍스트의 제목과 서브 제목을 나타냅니다. ‘#’ 기호를 사용하여 헤더의 크기를 조절할 수 있습니다. ‘#’ 기호의 개수가 적을수록 크기가 큽니다. 1개부터 6개까지 사용할 수 있습니다.


▼ 문법 및 예제

# 제목 1
## 제목 2
### 제목 3
#### 제목 4
##### 제목 5
###### 제목 6

3.2. 수평선(Horizontal Rules)

수평선은 문서에서 구분을 위해 사용됩니다. ‘-‘, ‘*’, ‘_’ 중 하나를 3개 이상 연속 사용하여 수평선을 만들 수 있습니다.


▼ 문법 및 예제

---
***
___

3.3. 줄 바꿈(Line Breaks)

줄 바꿈은 문장이 끝나고 다음 줄로 넘어갈 때 사용합니다. 일반적으로 엔터키를 두 번 입력하면 줄 바꿈이 적용되지만 문장의 끝에 스페이스바를 두 번 입력한 후 엔터키를 한 번 입력해도 줄 바꿈이 적용됩니다. 또한 HTML 태그인 <br>을 사용하여 줄 바꿈을 적용할 수도 있습니다.


▼ 문법 및 예제

이것은 첫 번째 문장입니다.  
이것은 두 번째 문장입니다.
    
이것은 새로운 단락입니다.<br>이것은 또 다른 줄입니다.

3.4. 강조(Emphasis)

마크다운에서는 텍스트를 강조하기 위해 볼드체와 이탤릭체를 사용할 수 있습니다. 볼드체는 두 개의 별표(**) 또는 두 개의 언더바(__)로 텍스트를 감싸고, 이탤릭체는 한 개의 별표(*) 또는 한 개의 언더바(_)로 텍스트를 감싸서 사용합니다.


▼ 문법 및 예제

*이것은 이탤릭체입니다.*
_이것도 이탤릭체입니다._
**이것은 볼드체입니다.**
__이것도 볼드체입니다.__

3.5. 인용(Blockquotes)

인용은 ‘>’ 문자로 시작하는 텍스트로 작성합니다. 여러 단계의 인용도 가능하고 각 단계마다 추가로 ‘>’ 문자를 사용합니다.


▼ 문법 및 예제

> 이것은 인용입니다.
>> 이것은 두 번째 단계 인용입니다.
>>> 이것은 다시 첫 번째 단계 인용입니다.

3.6. 목록(Lists)

3.6.1. 순서가 없는 목록(Unordered lists)

순서가 없는 목록은 별표(*), 더하기 기호(+), 빼기 기호(-) 중 하나로 시작하는 텍스트로 작성합니다.


▼ 문법 및 예제

* 항목 1
* 항목 2
* 항목 3

3.6.2. 순서가 있는 목록(Ordered lists)

순서가 있는 목록은 숫자와 마침표(1., 2., 3.)로 시작하는 텍스트로 작성합니다.


▼ 문법 및 예제

1. 첫 번째 항목
2. 두 번째 항목
3. 세 번째 항목

3.6.3. 혼합 리스트(Mixed lists)

순서가 있는 목록과 순서가 없는 목록을 혼합하여 사용할 수도 있습니다.


▼ 문법 및 예제

1. 첫 번째 항목
2. 두 번째 항목
   * 두 번째 항목의 첫 번째 하위 항목
   * 두 번째 항목의 두 번째 하위 항목
3. 세 번째 항목
   1. 세 번째 항목의 첫 번째 하위 항목
   2. 세 번째 항목의 두 번째 하위 항목

3.7. 백슬래시 이스케이프(Backslash Escapes)

마크다운에서 특수 문자를 일반 문자로 표현하려면 백슬래시”를 사용하여 이스케이프 처리할 수 있습니다. 예를 들어 일반적으로 별표(*)는 리스트 또는 강조를 나타내는데 이를 일반 문자로 표시하려면 백슬래시를 사용합니다.


▼ 문법 및 예제

* 이렇게 하면 별표가 표시됩니다.

3.8. 이미지(Images)

마크다운에서 이미지를 삽입하려면 다음과 같은 구문을 사용합니다.


▶ 문법: ![대체 텍스트](이미지_URL “이미지 제목(선택 사항)”)

▼ 문법 및 예제

![BlueShare 블로그 logo 이미지](https://tistory1.daumcdn.net/tistory/5103346/skin/images/bs_logo.png "Logo 이미지")


☞ 대체 텍스트는 이미지가 렌더링 되지 않을 때 표시되는 텍스트로 접근성을 위해 사용됩니다. 이미지 제목은 이미지에 마우스를 올렸을 때 표시되는 텍스트로 선택 사항입니다. 이미지 URL은 웹상의 이미지 주소 또는 로컬 파일 경로를 사용할 수 있습니다.

3.9. 링크(Links)

3.9.1. 외부 링크(External Links)

외부 링크는 웹페이지 주소를 연결하기 위한 것입니다. 다음과 같은 구문을 사용하여 외부 링크를 만듭니다.


▶ 문법: [링크 텍스트](링크_URL)

▼ 문법 및 예제

[BlueShare 블로그](https://blueshare.tistory.com)

3.9.2. 내부(해시) 링크(Internal/Hash Links)

내부 링크는 같은 문서 내에서 이동하기 위한 것입니다. 대상 항목에 앵커를 추가하고 링크 구문에 앵커 ID를 넣습니다. 앵커를 만들 때는 대상 항목 앞에 앵커 태그(<a id=”앵커_ID”></a>)를 추가합니다.


▼ 문법 및 예제

[목차로 이동](#목차)
    
<a id="목차"></a>목차


☞ [목차로 이동](#목차) 부분이 내부 링크이며 #목차가 앵커 ID입니다. <a id=”목차”></a>는 앵커 태그로 이 태그 앞에 있는 “목차”라는 텍스트를 클릭하면 문서 내에서 “목차”라는 항목으로 이동합니다.

3.10. 코드 블록(Code Blocks)

코드 블록은 코드를 간단하게 표시하거나 여러 줄의 코드를 표시할 때 사용합니다.


1. 인라인 코드 블록: 역따옴표(`)를 사용하여 감싸서 작성합니다.

▼ 문법 및 예제

`print("Hello, World!")`


2. 여러 줄의 코드 블록: 세 개의 역따옴표(“`)로 감싸서 작성합니다.

▼ 문법 및 예제

```python
def greet():
    print("Hello, World!")
    
greet()
```

3.11. 체크 리스트(Checklists)

체크 리스트는 할 일 목록을 표시할 때 사용합니다.


▼ 문법 및 예제

- [x] 운동하기
- [ ] 블로그 글 작성하기

3.12. 테이블(Tables)

테이블은 행과 열로 구성된 데이터를 표시할 때 사용합니다. 테이블을 생성하려면 헤더 행을 작성한 다음 헤더와 본문 사이에 적어도 3개의 하이픈(—)으로 구성된 구분 행을 추가합니다. 이 구분 행은 각 열의 정렬을 설정할 수도 있습니다. 각 열의 셀은 파이프(|)로 구분합니다.

  • 가운데 정렬: 셀 구분자 양쪽에 콜론(:)을 사용합니다. (예: :—:)
  • 왼쪽 정렬: 셀 구분자의 왼쪽에 콜론을 사용합니다. (예: :—)
  • 오른쪽 정렬: 셀 구분자의 오른쪽에 콜론을 사용합니다. (예: —:)


▼ 문법 및 예제

| 이름   | 나이 | 도시     |
|:-----|---:|:------:|
| 철수 | 20 | 서울    |
| 영희 | 22 | 일산    |
| 민수 | 23 | 인천    |


이 글이 도움이 되셨다면 공유를 부탁 드립니다. 다음 글에서 뵙겠습니다!

위로 스크롤