개발/개발 공통

[파일 형식] 마크다운(Markdown) 파일에 대해서

growing-dev 2023. 2. 12. 00:12
반응형

특정 문법을 사용해서 화면에 표시해 주는 마크업 language 중 하나인 마크다운 언어의 문법을 알아보고 사용해 보도록 한다.

 

마크다운(Markdown) 파일에 대해서

 

마크다운(Markdwon)이란

Markdown은 텍스트 기반의 마크업언어로 2004년 존그루버에 의해 만들어졌다. HTML로 변환이 가능하며 간단하게 작성할 수 있다. 특수기호와 문자를 이용해서 간단한 구조의 문법을 정하였으며 직관적이며 웹에서 쉽게 활용할 수 있다. 마크 다운이 대표적으로 많이 사용되는 곳이 GitHub이다. GitHub의 최초 README.md 가 바로 Markdown(. md) 파일이다. 각종 오픈소스 프로젝트에서 많이 활용되고 Wiki 등과 같은 곳에서 사용법과 가이드 문서 등을 자주 활용하게 되면서 널리 사용되고 있다. 현재 티스토리도 Markdown을 지원해서 오른쪽 위에 기본모드 말고 마크다운도 지원해서 접근성이 매우 좋다.

 

마크다운의 문법

여기서는 마크다운의 문법을 알아본다. 문법이 매우 간단하기 때문에 바로 작성해 볼 수 있고 GitHub를 통해 확인도 가능하다. 나는 VS Code를 활용했다. GitHub의 repository를 만들 때 README.md를 생성하도록 만들고 git clone 하면 README.md 파일이 존재하고 이를 VS Code에서 수정하면서 활용해보았다. VS Code에서 Markdown All in one을 설치하면 훨씬 편리하게 실험해 볼 수 있고 Preview를 제공해서 바로바로 적용된 내용을 확인해 볼 수 있다. 

 

헤더

  • 헤더는 #으로 시작한다.
  • #의 개수에 따라 1~6까지 지원한다.
# H1
## H2
### H3
#### H4
##### H5
###### H6
####### H7

헤더1~7까지 예시 7은 지원하지 않는다

 

인용문자

> 를 활용하여 인용문자를 표현하는 방법이다.

> first blockqute
>> second blockqute
>>> third blockqute

인용문자 예시

 

 

목록(번호)

1. 2. 3. 이런 식으로 숫자와 점으로 표시하면 리스트로 표현된다.

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

GitHub에서 예시

순서를 다르게 입력하더라도 알아서 숫자 순서대로 표시된다. 이게 좋을 수도 있고 나쁠 수도 있는 것 같다.

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

순서는 알아서 정해진다

 

목록(*, +, -)

* 첫번째
* 두번째
* 세번째

- 첫번째
- 두번째
- 세번째

+ 첫번째
+ 두번째
+ 세번째

*, +, - 모두 같게 표시된다

    •  

코드

코드를 삽일할 일이 빈번한데 이때 코드블록을 활용하면 된다. ```로 시작하고 ```로 끝나면 해당 블록은 코드로 인식해서 네모칸으로 별도로 표시가 된다.

Code block below
```
#include <stdio.h>

int main(void) {
    printf("Hello");
    return 0;
}
```

코드블럭 사용 예시

 

언어에 따라 c, cpp, java, bash 등과 같은 정보를 더 입력하면 상황에 맞게 더 보기 좋게 표시해준다. 아래 예시는 GitHub에서 cpp로 했을 때 달라지는 모습이다.

Code block below
```cpp
#include <stdio.h>

int main(void) {
    printf("Hello");
    return 0;
}
```

GitHub cpp 코드블럭

 

나누기

수평선을 통해서 페이지를 나누거나 제목과 본문을 분리할 때 활용한다.

제목1
***
1. 내용1
2. 내용2  

  
제목2
***
1. 내용3
2. 내용4

수평선을 통한 내용 분리 예시

 

링크

참조 링크를 연결할 때 아래와 같이 [표시할 글자](링크 주소) 의 형태로 사용한다.

[Google](https://google.com/)은 가장 유명한 회사 중 하나이다.
[성장하는 개발자 블로그](https://growing-dev101.tistory.com/)를 참고하세요.

 

글자 스타일 변경

아래와 같이 특수문자를 활용해서 여러가지 스타일로 변경할 수 있다.

*single asterisks*
_single underscores_
**double asterisks**
__double underscores__
~~cancelline~~

여러가지 글자 스타일

 

이미지 첨부

이미지는 링크와 비슷한데 맨 앞에 느낌표 ! 를 붙여주면 된다.

![이미지 설명](이미지 주소/_images/img.jpg)

 

줄바꾸기

한 줄이 끝나고 2칸 이상 띄어쓰기를 하면 표시되는 줄이 바뀌거나 <br>을 활용한다.

한 줄이 끝났습니다.
그 다음 줄에 쓰더라도 한 줄로 표시됩니다. (띄어쓰기 2개 추가)  
띄어쓰기 2개를 추가하니 그 다음 줄로 표시됩니다. (br 추가) <br>
br을 추가해도 그 다음 줄로 표시됩니다.

줄바꾸기

 

 

마크다운의 장점

 

  • 쉽다. 프로그래밍 언어를 몰라도 작성가능하다.
  • 별도의 프로그램이 없어도 작성할 수 있다. 단 원하는 대로 제대로 하려면 도구가 있으면 훨씬 좋다.
  • HTML 등과 같은 언어로 전환이 쉽다.
  • 여러 시스템에서 사용할 수 있다.

 

마크다운의 단점

  • 가장 큰 단점은 표준화된 포맷이 존재하지는 않는다는 점이다. 강제적인 방식이 아니므로 기본적인 문법은 동일하지만 부가적인 기능이나 실제 화면에 표시되는 내용이 달라질 수 있다.
  • 표준이 없고 많은 기능을 지원하지는 않아서 HTML과 같은 언어로 대체하긴 어렵다.

 

결론

GitHub와 티스토리를 사용하다 보니 마크다운을 특별히 알아보지 않아도 익숙해졌다. 사실 복잡하거나 특별한 내용은 없다. 워낙 많은 곳에서 사용하기 때문에 알아둬서 나쁠 건 없을 것이다.

 

 

반응형