Yours Ever, Data Chronicles

[Markdown #1] Markdown 알아보기/마크다운/markdown tutorial 본문

Skillset/Etc.

[Markdown #1] Markdown 알아보기/마크다운/markdown tutorial

Everly. 2021. 3. 10. 01:09

이번 포스팅은 Markdown(마크다운)에 대해 알아봅니다. Markdown은 쓰는 방식이 정해져 있는데, 한번 배워 두면 Github의 README.md, python jupyter notebook에서의 markdown, 그리고 R markdown에 모두 적용 가능하답니다. :)

 

구체적으로는, 글씨체, 헤더(header), 링크(link)삽입, 이미지 삽입, 인용구, 리스트, 단락에 대해서 배워봅니다.

 

이번 마크다운 포스팅은 Markdown Tutorial(www.markdowntutorial.com/kr/)을 참고하였습니다. 간단한 10분 실습이 가능하니, 마크다운에 대해 직접 경험해보고자 하신다면 한번 해보시는 것을 추천합니다.

 

1. 글씨체: 이탤릭체(italics)와 볼드체(bold) 사용하기

이탤릭체는 글자의 양옆에 * 또는 _를 사용하여 만듭니다. ex) *글자* or _글자_

볼드체는 글자의 양옆에 ** 또는 __를 사용하여 만듭니다. ex) **글자** or __글자__

이렇게 글자의 양 옆에 *(star) 또는 _(underscore) 기호를 적용하여 간단하게 이탤릭체와 볼드체를 만들 수 있습니다.
이탤릭체와 볼드체는 한꺼번에 사용 또한 가능합니다. 이 때는 *와 _를 섞어 사용합니다. 보통은 볼드를 바깥쪽에 위치하도록 사용합니다.

 

2. 헤더(Header) 사용하기

헤더는 보통 제목을 지정할 때 사용하며, # 기호의 개수에 따라 글자 크기를 다르게 할 수 있습니다.

#이 1개일 때 가장 글자가 크며, #의 개수가 늘어날수록 글자가 점차 작아집니다.

보통은 #을 쓰고 글자를 한 칸 띄우지만(스페이스바 이용), 글자를 띄우지 않아도 적용되기도 합니다.  하지만 적용되지 않을 수 있으니 항상 글자를 한 칸 띄우고 쓰는 것을 추천합니다.

 

3. 링크(link) 삽입하기

글자에 링크 삽입을 위해선, 글자를 대괄호 [ ] 로 묶은 후, 그 옆에 소괄호 ( )를 쓰고 링크의 주소를 적어줍니다.

ex. [글자](suy379.tistory.com) 

 

대표적인 적용 방식입니다.
만일 특정 글자인 'the BBC'에만 링크를 적용하고 싶다면, 'the BBC'에만 대괄호([ ])를 적용하고 그 뒤에 링크를 적어야 합니다.
잘 쓰지는 않지만, 참조 링크를 적용한 예입니다. [see somthing fun]과 [the website for you]는 태그로, 링크가 적용되는 문자이고, 링크를 입력해주는 참조 링크인 [a fun place]와 [another fun place]는 따로 화면에 나타나진 않지만, 실제 링크 주소를 받는 참조 링크입니다.

 

4. 이미지(image) 삽입하기

이미지 삽입은 링크와 비슷한데, 딱 하나, 대괄호([ ]) 앞에 느낌표(!)를 쓰는 것이 다릅니다. ex. ![이미지 제목](이미지 주소)

다만 이미지 제목은 화면상으로 보이지 않습니다. 그래서 제목을 쓰지 않고 그냥 빈 대괄호로 나둬도 무관합니다.

대표적인 적용 방식입니다.
앞서 참조 링크에서 했던 것과 동일한 방식으로 이미지에 대해서도 참조 링크를 적용할 수 있습니다. ![이미지 제목] 뒤에 [참조 링크]를 달고 이 [참조 링크]에 대해서 실제 이미지 주소를 적용해 주면 됩니다.
만일 느낌표(!)를 제거한다면 이렇게 'Black cat'과 'Orange cat'에 하이퍼링크가 생기겠죠?

 

5. 인용구(quotes) 사용하기

인용구의 경우 '>' 기호를 사용하는데, 인용구로 표시하고자 하는 문장의 맨 앞에 '>'를 입력하면 됩니다.

대표적인 적용 방식입니다.
이렇게 줄바꿈이 된 전체 문장을 한번에 인용구로 묶기 위해선 공백 부분에 '>' 기호를 입력합니다. 또는 나와있는 세 문장의 가장 첫줄에 '>' 기호를 입력해도 됩니다.

 

6. 리스트(List) 사용하기

순서가 없는 리스트의 경우는 - 또는 *를 이용합니다. (특수문자 뒤에 띄어쓰기 필수)

순서가 있는 리스트의 경우엔 문장의 맨 앞에 1. 2. 3. ... 또는 1. 1. 1. ... 을 씁니다. (특수문자 뒤에 띄어쓰기 필수)

대표적인 적용 방식입니다. 여기선 - 를 사용했는데, * 를 써도 동일한 결과가 나옵니다.
순서가 있는 리스트의 경우는 문장 맨 처음에 1. 2. 3.... 처럼 순서를 달아줍니다. 그냥 1. 1. 1...처럼 1만 써도 자동으로 순서를 달아줍니다.
순서가 없는 리스트에서 하위 리스트를 만드려면 - 또는 *를 밑에 한 칸 띄우고(스페이스바 이용) 써주면 됩니다.
굳이 리스트로 만들고 싶지 않다면 이렇게 문자를 쓰지 않고 그냥 텍스트를 입력하면 됩니다. 하지만 위와 같이 1번, 2번으로 되어 있을 때 그냥 텍스트를 쓰면 들여쓰기가 안되므로 꼭 한 칸을 띄우고 써야 하며, 중간에 엔터로 공백을 주어야 문장이 합쳐지지 않습니다.(주의!)

 

7. 단락(Paragraph) 주기

이번 부분은 실제로 마크다운으로 텍스트를 쓸 때 가장 헷갈리는 부분입니다.

먼저 다음의 문장을 적었을 때, 문장마다 엔터(enter)를 쳤으므로 당연히 이와 똑같이 출력되겠다고 생각했겠지만 실제로 해보면 오른쪽 출력결과처럼 나옵니다. 그럼 문장마다 엔터를 쳐서 띄어쓰기를 하려면 어떻게 해야 할까요? 

정답은 문장의 뒤에 스페이스바를 2번 입력하는 것입니다. 이를 soft break라고 하는데, 위의 문장과 똑같으나 각 문장마다 뒤에 스페이스를 2번 입력하면 이번에는 엔터를 쳐서 띄어쓰기를 한 것처럼 나옵니다.

We pictured the meek mild creatures where..
They dwelt in their strawy pen,..
(여기서 .는 스페이스 1번을 의미합니다.)

마찬가지로 순서가 있는 리스트 안에서 글을 쓸 때, 엔터를 너무 남발하면 이렇게 정갈하지 못한 텍스트로 출력됩니다. 심지어 엔터를 1번만 하면 문장끼리 붙어서 나오니까 엔터를 2번씩 쳐야 하죠! 하지만 그렇게 하면 문장 간 간격이 또 생겨버립니다.

이럴 때 사용하기 좋은 것이 soft break입니다.

위의 문장을 다음처럼 수정하면 좀 더 정갈하고 예쁜 텍스트가 출력됩니다.

1번, 2번 문장 뒤에 스페이스 2번으로 soft break를 주면 엔터로 줄바꿈을 하는 효과가 있습니다. 또한 1,2번 리스트 내의 문장으로 들여쓰기를 하려면 각 문장의 첫번째를 한 칸 띄어써야 하겠죠? 문장 간 엔터로 줄바꿈을 하고는 싶지만 너무 많이 떨어지진 않았으면 좋겠다면 마찬가지로 각 문장의 뒤에 soft break를 주면 됩니다.

 

 

이렇게 기본적인 마크다운의 활용법을 배워보았습니다. 이어지는 다음 포스팅에서는 github readme, python markdown, R markdown에서 어떻게 이 마크다운을 사용하여 텍스트를 꾸밀 수 있는지 실습해봅니다.

도움되는 포스팅이었길 바라며 마칩니다.

반응형