개발 블로그를 시작하면서 마크다운 작성법의 필요성이 느껴지게 되었다.

많은 개발자분들이 GitHub에서 프로젝트를 마치고나면 README.md 파일을 통해서 완성한 프로젝트를 전체적으로 설명하고는 하는데

나는 마크다운 작성법을 잘 모른다는 핑계를 대며 간단한 프로젝트들이었음에도 README.md 파일 조차 만들어 정리해두지 않았다.

velog에 블로그를 시작한 이유도 블로그 게시글을 작성하려면 MarkDown 작성법에 대해서 알아야하고

이번 정리를 통해서 내 GitHub에 완성된 프로젝트들에 README.md 작성까지 완성하려고 한다.

마크다운 이란?

마크다운(markdown)은 일반 텍스트 기반의 경량 마크업 언어다. 일반 텍스트로 서식이 있는 문서를 작성하는 데 사용되며, 일반 마크업 언어에 비해 문법이 쉽고 간단한 것이 특징이다. HTML과 리치 텍스트(RTF) 등 서식 문서로 쉽게 변환되기 때문에 응용 소프트웨어와 함께 배포되는 README 파일이나 온라인 게시물 등에 많이 사용된다.
-wikipedia

📑 마크다운 작성법

1. 제목(Header)

h1 부터 h6의 크기까지 제목을 표현 할 수 있다.
#를 6개까지 붙여서 표현 한다.

✍ 마크다운 작성

# h1
## h2
### h3
#### h4
##### h5
###### h6

💻 결과

---

h1

h2

h3

h4

h5

h6

---

2. 줄, 문단 간격

Enter, <br>, <br/> 를 이용해서 줄과 문단을 나눌 수 있고, <br> 이나 <br/> 개수를 늘려 여러 간격 나눌 수 있다.

Enter로는 한 줄 밖에 개행이 안된다!

✍ 마크다운 작성

엔터 한번 시작 `Enter 키 입력`
엔터 한번 끝

엔터 두번 시작 `Enter 키 입력` `Enter 키 입력`
엔터 두번 끝

`<br>`로 나누기 시작 <br>
`<br>`로 나누기 끝

`<br/>` 두개 로 나누기 시작 <br/><br/>
`<br/>` 두개 로 나누기 끝

💻 결과

---

엔터 한번 시작

엔터 한번 끝

---

엔터 두번 시작

엔터 두번 끝

---

<br>로 나누기 시작

<br>로 나누기 끝

---

<br/> 두개 로 나누기 시작


<br/> 두개 로 나누기 끝

---

3. 인라인 코드

｀｀를 사용해서 텍스트를 감쌀수 있다.

✍ 마크다운 작성

`감싸고 싶은 텍스트`

💻 결과

---

감싸고 싶은 텍스트

---

4. 들여쓰기

tab 키 1번이나 space 4번 입력으로 들여쓰기가 가능하다.

✍ 마크다운 작성

일반 글
`tab키` 탭 키로 들여쓴 글
`space``space``space``space` 스페이스바 4 번으로 들여쓴 글

💻 결과

---

일반 글

탭 키로 들여쓴 글

스페이스바 4번으로 들여쓴 글

---

5. 코드 블록

``` 이나 ~~~ 를 첫 줄과 마지막 줄에 입력 해주면 된다.

```언어이름 입력으로 코드 하이라이트도 가능하다.

✍ 마크다운 작성

```
코드 블록
```

```java
int a = 3;
```

💻 결과

---

코드 블록

int a = 3;

---

6. 인용문

>를 사용해서 인용문을 표현할 수 있다.

✍ 마크다운 작성

> 인용문.
>> 중첩 인용문.

💻 결과

---

인용문.

중첩 인용문.

---

7. 수평선

---를 입력하여 수평선을 표현 할 수 있다.

✍ 마크다운 작성

---
수평선
---

💻 결과

---

---

수평선

---

---

8. 목록

목록에는 순서 목록과 순서가 없는 목록이 있다.

8.1 순서 목록

숫자.로 순서 목록을 표현할 수 있다.
숫자.숫자로 세부 목록도 가능하다.

✍ 마크다운 작성

일반글

1. 첫 번째
2. 두 번째
3. 세 번째
3.1 네 번째

💻 결과

---

일반 글

1. 첫 번째
2. 두 번째
3. 세 번째
   3.1 네 번째

---

8.2 순서가 없는 목록

-, *, +를 사용해서 표현 할 수 있다.
space를 2개 단위로 사용함으로써 세부 목록도 가능하다.

✍ 마크다운 작성

- 첫 번째
* 두 번째
+ 세 번째
`space``space`- 네번째
`space``space``space``space`- 다 섯번째

💻 결과

---

• 첫 번째

• 두 번째

• 세 번째

  • 네 번째

    • 다 섯번째

---

9. 글자 스타일

_, *, ~를 사용하여 진하게, 기울이기, 취소선 등의 글자 스타일을 표현 할 수 있다.

✍ 마크다운 작성

**진하게**
__진하게__

*기울이기*
_기울이기_

~~취소선~

💻 결과

---

진하게
진하게

기울이기
기울이기

취소선

---

10. 링크

[링크](https://링크.com)으로 url에 제목을 붙이거나, <링크.com/>으로 바로 url을 달아줄 수 있다.
com 뒤에 "링크 설명" 입력으로 커서를 가져다 대었을때 링크 설명을 표현 하는 것도 가능하다.

✍ 마크다운 작성

[Google](https://www.google.com)

[Google](https://www.google.com "구글 입니다.")

<https://www.google.com/>

💻 결과

---

Google

Google

https://www.google.com/

---

11. 이미지

![설명](이미지 링크)로 이미지를 삽입할 수 있다.

[![설명](이미지 링크)](https://링크.com "링크 설명")으로 이미지에 url 삽입도 가능하다.

✍ 마크다운 작성

![구글](https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png)

[![구글](https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png)](https://google.com "구글 입니다.")

💻 결과

---

---

12. 목차

[설명](#본문내용) 링크와 동일하게 본문에 목차를 달아 줄 수 있다.
이때 뛰어쓰기는 (#본-문-내-용) 처럼 -로 표현해주어야 하고, 영어는 소문자만 가능하다.

✍ 마크다운 작성

[마무리로 가기](#마무리)

💻 결과

---

마무리로 가기

---

13. 이모지 이모티콘

😊 MacOS 는 ctrl + cmd + space bar
😊 Windows는 window key + 세미콜론, window key + . 입력으로 이모지 이모티콘 사용이 가능하다.

😒 Windows의 경우 만약 키가 작동하지 않으면 아래 링크를 참조하자!

윈도우10 이모지 단축키가 안될 때 해결방법

14. 표(테이블)

|를 이용하여 표를 만들 수 있다. <span> tag와 *, **를 통한 이태릭/강조 표시도 가능하다.

✍ 마크다운 작성

|제목|내용|설명|
|---|---: |:---:|
|일반|오른쪽정렬|중앙정렬|
|일반|**오른쪽정렬**|중앙정렬|
|일반|<span style="color:red">오른쪽정렬</span>|중앙정렬|

💻 결과

---

제목	내용	설명
일반	오른쪽정렬	중앙정렬
일반	오른쪽정렬	중앙정렬
일반	오른쪽정렬	중앙정렬

---

마무리

블로그에 정리하면서 느낀거지만 굉장히 단순한 방법으로 작성이 가능하지만

자주 자주 사용해서 습관을 들여야 할 것 같다.

혹시나 저처럼 아직 마크다운 작성법이 익숙하지 않으신 분들이나

기억 안나는 작성법들이 있는 분들에게 도움이 되었으면 좋겠습니다. 감사합니다!

🙆‍♂️ 참고사이트 🙇‍♂️

velog 마크다운(markdown) 작성법
Velog 간단 사용법
마크다운 문서에서 목차 만들기