[별별 웹 용어] 마크업(MarkUp)? 마크다운(MarkDown)?

웹 개발을 조금 해본 사람이라면 누구나 HTML을 알고 있을 겁니다.

HTML은 웹 페이지의 뼈대를 구성하는 언어 입니다.

쉽게는 웹 브라우저에서 '아무 페이지나 열고 -> 마우스 우클릭 후에 -> 검사'를 누르면 확인할 수 있습니다.

<크롬 브라우저 검사 기능>

HTML : Hyper Text MarkUp Language

HTML은 마크업 언어입니다. 그러면 업(UP)이 있으니까 마크다운(DOWN) 언어도 있을까요?

네, 마크다운 언어도 있습니다!

그러면 마크업(MarkUp) 언어, 마크다운(MarkDown) 언어가 뭔지 알아보도록 하겠습니다.

마크업(MarkUp)언어란?

마크업 언어는 "마크(Mark)"로 둘러싸인 언어입니다. "태크(Tag)"로 둘러싸였다고도 표현합니다. HTML, XML 등의 마크업 언어들은 문서의 구조를 정의합니다. 쉽게 말하면 문서의 골격에 해당하는 부분을 작성하는데 사용합니다.

마크다운(MarkDown)언어란?

마크다운 언어는 마크업 언어의 일종으로, 존 그루버(John Gruber)와 아론 스워츠(Aaron Swartz)가 만들었습니다.

읽기도 쓰기도 쉽다는 장점이 있습니다.

그루버는 작성한 마크다운 언어 문서를 HTML 파일로 변환해주는 펄(Perl) 스크립트도 만들었습니다.

그 파일이 우리가 흔히 사용하는 .md 확장자의 파일입니다. (Readme.md 라던지...)

- 나무위키

이렇게만 들어보면 크게 감이 오지는 않습니다.

그런데 우리가 일상적으로 아주 많이 자주 사용하지만 마크다운 언어라고 인식하지 못하는 것이 있습니다.

바로 페이스북 태그 기능인데요!

<페이스북 태그 기능>

페이스북 태그 기능도 대표적인 마크다운 언어라고 할 수 있습니다.

"@"가 붙은 문자열을 자동으로 태그로 인식하는 마크다운 언어지요.

우리가 사용하는 마크다운 언어는 다음과 같은 것들이 있습니다.

• SNS의 '태그' 기능
• 위키 백과 편집 기능
• 사실 이런거 말구는 잘 안써요...

<마크다운으로 작성된 페이지와 그렇지 않은 페이지 (사진을 클릭하면 확대해서 볼 수 있습니다!)>

마크다운 언어는 누구나 쉽게 만들 수 있습니다. (사실 쉽지는 않습니다.)

그렇기에 마크다운 언어마다 문법이 다르고 포맷이 다릅니다.

우리가 제일 많이 사용하는 마크다운 언어 확장자인 .md의 문법에 대해서 간단하게 소개해 드리겠습니다.

.md 파일 문법

• # : 페이지 헤딩입니다. html의 <h1> ~ <h6> 태그에 해당합니다. 쓰고 싶은 만큼 붙여서 쓰면 됩니다. (최대 6개)
• * 순서가 없는 리스트를 만들 수 있습니다. 탭으로 안쪽으로 들여쓴 목록을 만들 수 있습니다.
• 1. 2. 3. ... : 순서가 있는 리스트를 만들 수 있습니다. 탭으로 안쪽으로 들여쓴 목록을 만들 수 있습니다.
• *[글씨]* : 기울인 글씨를 쓸 수 있습니다.
• **[글씨]** : 굵은 글씨를 쓸 수 있습니다.
• [링크 내용](링크 주소) : 링크를 만들 수 있습니다. 주소 url을 그대로 적으면 자동으로 링크가 만들어 집니다.
• > : 인용구를 작성합니다.

마크다운을 실시간으로 작성할 수 있는 사이트들이 있습니다. 제가 봤을 때 개발자들이 쓰기 좋은 페이지는

마크다운 에디터 : https://pandao.github.io/editor.md/en.html

인 것 같습니다.

<마크다운 에디터>

대충 이 정도가 있겠습니다! 더 자세한 내용은 마크다운과 관련된 게시글에서 하도록 하겠습니다! 감사합니다!