Awesome Markdown Guide

Photo by Pexels on Pixabay

What is Markdown?

• 마크다운은 웹에서 스타일을 지정하는 방법 중 하나이다.
• 문서 표시를 제어할 수 있다.
  • 단어를 굵게(Bold) 또는 기울임꼴(Italic)로 표시하거나,
  • 이미지를 추가하고,
  • 목록을 만드는 일을 할 수 있다.
• GitHub에서는
  • Repository의 README 문서를 작성하거나,
  • Gist를 생성하고,
  • .md 또는 .markdown 을 확장자로 갖는 문서를 작성한다.

Basic Syntax

제목 (Headings)

# Heading level 1
## Heading level 2
###### Heading level 6

Heading level 1

Heading level 2

Heading level 6

Alternate Syntax

Heading level 1
===============

Heading level 1

Heading level 2
---------------

Heading level 2

강조 (Emphasis)

*This text will be italic*
_This will also be italic_

This text will be italic

This will also be italic

**This text will be bold**
__This will also be bold__

This text will be bold

This will also be bold

_You **can** combine them_

You can combine them

취소선 (Strikethrough)

~~This text will have a strikethrough~~

This text will have a strikethrough

목록 (Lists)

순서 없는 목록 (Unordered, 글머리 기호)

* Item 1
   * Item 1-1
   * Item 1-2
      * Item 1-2-1
- Item 2
+ Item 3

• Item 1
  • Item 1-1
  • Item 1-2
    • Item 1-3

• Item 3

• Item 4

* Step 1
   - Step 1-1
      + Step 1-1-1

• Step 1
  Step 1-1
  Step 1-1-1

Note.

• 글머리 기호를 혼용해서 사용할 수도 있다.

순서 있는 목록 (Ordered, 번호)

1. First
1. Second
2. Third

1. First
2. Second
3. Third

Note.

• 입력하는 숫자에 관계없이 오름차순으로 배정된다.

작업 목록 (Tasks)

[x] This is a complete item
[ ] This is an incomplete item

[x] This is a complete item

[ ] This is an incomplete item

Note.

• 제대로 동작하는 것인지 잘 모르겠음

인용 (Blockquotes)

> This is blockquote
>
> > This is nested blockquote

This is blockquote

This is nested blockquote

> Blockquotes can contain other Markdown formatted elements.
>
> #### Heading
>
> - unordered list
> 1. ordered list
>
> *Not all elements can be used* - **you'll need to experiment to see which ones work.**

Blockquotes can contain other Markdown formatted elements.

Heading

• unordered list

1. ordered list

Not all elements can be used - you'll need to experiment to see which ones work.

이미지 (Images)

![Sample image](images/0002.jpg)
Format: ![Alt Text](url)

Photo by Joris Visser on Unsplash

Note.

• 캡션, 사이즈 조절은 지원하지 않음.
• 필요한 경우 HTML 태그로 처리.

링크 (Links)

[DaveLogs](http://davelogs.tistory.com)
Format: [Link Text](url)

http://davelogs.tistory.com - automatic!

DaveLogs

http://davelogs.tistory.com - automatic!

인라인 코드 (Inline code)

You should write a `README.md` in GitHub.

You should write a README.md in GitHub.

이모티콘 (Emoji)

Wow! Awesome!! :clap: :+1: :sunglasses:

Wow! Awesome!! :clap: :+1: :sunglasses:

Note.

• Emoji cheat sheet

수평선 (Horizontal line)

Here
--- (dashes)
*** (asterisks)
___ (underscores)
There

Here

---

---

---

There

Note.

• 3개 이상의 하이픈(-), 아스테리스트(*) 또는 언더스코어(_)를 이용해 수평선 적용
• 문단이나 세션, 페이지 등을 나눌 때 사용

Extended Syntax

테이블 (Tables)

(row, col) | column 1 | column 2 | column 3
---------- | -------- | -------- | --------
row 1      | (1, 1)   | (1, 2)   | (1, 3)
row 2      | (2, 1)   | (2, 2)   | (2, 3)
row 3      | (3, 1)   | (3, 2)   | (3, 3)

(row, col)	column 1	column 2	column 3
row 1	(1, 1)	(1, 2)	(1, 3)
row 2	(2, 1)	(2, 2)	(2, 3)
row 3	(3, 1)	(3, 2)	(3, 3)

Alignment

Syntax    | Description | Test Text
:-------- | :---------: | ----------:
Left      | Center      | Right
This      | is          | the alignment

Syntax	Description	Test Text
Left	Center	Right
This	is	the alignment

Note.

• 하이픈(-)과 파이프(|)를 이용해 표를 테이블을 구성
• 3개 이상의 하이픈(-)으로 첫번째 행으로 지정
• 콜론(:)과 하이픈(-)을 이용해 열(column)의 정렬 방법 설정

코드블록 (Fenced Code Blocks)

​```
$ sudo apt-get update
​```

$ sudo apt-get update

Syntax highlighting

​```javascript
function fancyAlert(arg) {
   if(arg) {
      $.facebox({div:'#foo'})
   }
}
​```

function fancyAlert(arg) {
   if(arg) {
      $.facebox({div:'#foo'})
   }
}

​```python
def validate(arg):
   if arg is None:
      return False
   return True
​```

def validate(arg):
   if arg is None:
      return False
   return True

​```json
{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}
​```

{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}

참고

• Mastering Markdown
• Getting Started | Markdown Guide
• 마크다운 사용법
• 마크다운(Markdown) 정리