본 글은 예전에 제가 발표한 알면 ㄱㅇㄷ Markdown을 조금 수정하여 포스팅 한 것입니다.
Markup
Markup Language
태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어의 한 가지
출처: 위키피디아
![]() |
![]() |
Markdown

텍스트 기반의 마크업언어로 2004년 존그루버에 의해 만들어졌으며 쉽게 쓰고 읽을 수 있으며 HTML로 변환이 가능하다.
특수기호와 문자를 이용한 매우 간단한 구조의 문법을 사용하여 웹에서도 보다 빠르게 컨텐츠를 작성하고 보다 직관적으로 인식할 수 있다.
출처: 마크다운에 관하여
문법
헤딩
HTML
Markdown
결과
h1 입니다
h6 입니다
순서 있는 리스트
HTML
Markdown
결과
- 하나
- 둘
- 셋
순서 없는 리스트
HTML
Markdown
결과
- 빨
- 주
- 노
문단
HTML
Markdown
결과
한문단
두문단
줄 넘김
HTML
Markdown
결과
줄
넘김
수평선
HTML
Markdown
결과
강조
HTML
Markdown
결과
굵게 기울게 취소
링크
HTML
Markdown
결과
이미지
HTML
Markdown
결과

블록 인용문
블록 인용문
HTML
Markdown
결과
인용문
코드 블럭
HTML
Markdown
printf("hello");
결과
printf("hello");
코드
HTML
Markdown
결과
여기에 코드
가 들어감
Markdown 사용하기
- Markdown editor
- stackedit.io
- 하루패드
- Github
- Readme.md
- Gist
- Github Pages
- Stackoverflow
- Jupyter
- Trello
- Slack
- Reveal.js
- Pandoc
- Tumblr
- Wordpress
- Ghost
- Tstory
- namuwiki
- 그 외 수없이 많음..
비 정규 표현
가장 처음 고안한 사람이 추가 문법을 만들지 않음
→
문법의 파편화
코드 블럭
```
int main() {
printf("Hello");
return 0;
}
```
int main() {
printf("Hello");
return 0;
}
언어에 따른 코드
```c
int main() {
printf("Hello");
return 0;
}
```
작업 목록
HTML
<form action="/">
<input type="checkbox"> taks 1 <br>
<input type="checkbox" checked> taks 2
</form>
Markdown
표
HTML
<table>
<tr><th>title 1</th><th>title 2</th></tr>
<tr><td> a </td><td> b </td></tr>
<tr><th>c</th><th>d</th></tr>
</table>
Markdown
title 1 | title 2 |
---|---|
a | b |
c | d |
동영상 추가
하루패드
HTML
Markdown
Atrribute 추가
reveal.js
HTML
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/7/73/170125_%EC%88%98%EC%A7%80_%EC%A7%80%EB%8B%88_%26%EB%9D%BC%EC%9D%B4%EB%B8%8C_01.jpg/250px-170125_%EC%88%98%EC%A7%80_%EC%A7%80%EB%8B%88_%26%EB%9D%BC%EC%9D%B4%EB%B8%8C_01.jpg" alt="이미지" style="float:left">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/4e/IU_at_Little_Forest_VIP_premiere_on_February_26%2C_2018_%284%29.jpg/250px-IU_at_Little_Forest_VIP_premiere_on_February_26%2C_2018_%284%29.jpg" alt="이미지" style="float:left">
Markdown
 <!-- .element style="float:left" -->
 <!-- .element style="float:left" -->
그냥 사용
- 줄 넘김
- URL
LaTeX
문서 조판에 사용되는 프로그램
한 줄
한 \(D(S, L) = - \sum_i L_i log(S_i)\) 줄
블럭
\[ H(x) = Wx + b \]
\[ cost(W, b) = \frac{1}{m}\sum\limits_{i=1}^m (H(x^{(i)}) - y^{(i)})^2 \]
뷰어마다 다 다르다
$$$
$$$
이 블럭일 수 도
참고
reveal.js의 경우 HTML, Javascript 코드는 마크다운 코드블럭에 넣기 어렵다.
직접 코드 태그를 이용해서 넣어야 한다.
HTML 엔티티를 넣어서 일일이 정의해야 한다