하루프레스의 모든 컨텐츠는 마크다운(Markdown)으로 작성

마크다운(Markdown) 이란?

MarkdownMarkdown is a text-to-HTML conversion tool for web writers. Markdown allows you to write using an easy-to-read, easy-to-write plain text format, then convert it to structurally valid XHTML (or HTML). by John Gruber

말그대로 마크다운은 웹에서 컨텐츠 문서를 작성을 위해서 html로 변환가능한 텍스트 문법이다. 정의에서 말하는 마크다운을 간다히 정리해보면

• 읽기 싶고
• 쓰기 싶고
• 일반 텍스트 기반으로 작성된
• HTML 컨버팅을 위한 문법이다.

하루프레스는 이 마크다운 문법을 사용한다. 즉 일반적으로 블로그 포스팅을 위해 알고 있어야하는(물론 반드시 필요한 것은 아니다.) HTML에 비해 표현법이 매우 단순하며 구조적인 작성이 가능해서 가독성도 높은 문서 작성 문법이다.

새로운 문법을 배워야 하는 기회비용

마크다운 역시 HTML과 마찬가지로 본연의 문법이 존재한다. 그러므로 마크다운이 아무리 싶다고 하지만 해당 문법을 익히고 있어야 한다.

하지만 너무 걱정하지 않아도 된다. 마크다운 문법은 매우 간단하고 쉬우면 HTML을 익히는 노력의 1/100 정도만 투자해도 거이 대부분의 표현법을 읽힐 수 있다.

그리고 HTML처럼 같은 태그를 사용해도 그 사용법에 따라 용도가 틀려진다던가 CSS를 어떻게 쓰느냐에 따라 같은 테그를 사용하더라도 전혀 다른 표현법이 나오는 것이 비해 매우 간단한 사용법과 문법사용에 있어 그 표현이 정확히 정해져 있기 때문에 몇가지 문법만 익히더라도 문서를 작성하는데 거의 지장을 받지 않는다.

마크다운 기본문법

해딩태그

HTML에서는 <h1> 등과 같은 해딩테그를 사용하지만 마크다운에서는 매우 간단한 # 로 표현하면 된다.

작성예

# H1
## H2
### H3

변환된 화면

H1

H2

H3

인용구

문서를 작성하다 보면 인용구를 사용하는 경우가 많다. 이글에서 마크다운 정의에 대한 부분이 바로 인용구 문법을 활용해서 작성된 것이다. HTML로 인용구를 사용할때는 css를 사용한 Box 레이아웃을 작성하여야 한다. 하지만 마크다운에서는 매우 간다한 방법으로 인용구를 사용할 수있다. 마크다운에서 사용하는 인용구 문법은 > 이다.

작성예

> 이글은 인용구 표현을 위한 더미 텍스트 입니다. 

변환된 화면

이글은 인용구 표현을 위한 더미 텍스트 입니다.

리스트

목차나 특정 목록에 대한 리스트에 대한 표현을 위해서 사용하는 리스트 문법은 HTML 에서 사용되는 <ul>, <ol> 등을 대체하는 문법이다. 마크다운 문법은 아래와 같다.

• 순차를 사용하지 않는 리스트
  • + 사용
  • * 사용
  • - 사용
• 순차를 사용하는 리스트
  • 1. , 2. 등을 사용

작성 예

* 리스트1
+ 리스트2
    * 서브 리스트1
    * 서브리스트 2
- 리스트3
    1. 순차 리스트1
    2. 순차 리스트2

변환된 화면

• 리스트1
• 리스트2
  • 서브 리스트1
  • 서브리스트 2
• 리스트3
  1. 순차 리스트1
  2. 순차 리스트2

강조구문

특정 단어나 문장의 강조를 위해 사용되는 문법

* 은 단독으로 사용되었을 때 리스트문법으로 사용되지만 블럭형으로 사용되면 강조문이 된다. 주의 할점은 강조하려는 문자열사이에 공백이 없어야 한다.

작성예

*이 문장을 강조하려고 합니다.*
**이 문장을 더욱 강조하려고 합니다.**

변환된 화면

이 문장을 강조하려고 합니다.

이 문장을 더욱 강조하려고 합니다.

링크 및 이미지

<a> 태그와 같은 역활을 수행하는 하이퍼링크 문법. 를 사용 하여 표현한다. 이미지 링크를 사용하고 싶은 경우 링크 문법 앞에 ! 를 붙혀 주기만 하면된다.

이미지 링크에서는 일반 링크와 달리 텍스트 내용이 alt attribute로 삽입된다.

작성예

[Incorrect Note 바로가기](http://insanehong.kr) // 외부링크
[Incorrect Note aboutme 바로가기](/about) // 내부링크
![인세인홍](./@img/insanehong.jpeg) // 이미지링크

변환된 화면

Incorrect Note 바로가기

Incorrect Note > about 바로가기

코드 블럭

코드 블럭은 여러가지 사용법이 있지만 사용법은 ```,~~~, 탭, 스페이스 4칸을 사용하는 것이다. 강조문법가 동일하게 블럭형 문법임으로 마지막에 동일한 문법으로 닫아주어야 한다.

var a=1,b=2;
function foo() { return a+b;}
foo();

마크다운 배울만 하지 않나?

위에서 소개 했듯이 마크다운은 매우 단순한 문법으로 표현하고자 하는 것을 문서화 할수 있다. HTML 을 사용할 경우 표현을 위한 태그가 난무 함에 따라 문서의 가독성 및 구조가 복잡해 지는 결과를 초래하는 반면 마크다운은 그 자체가 구조화된 표현식으로 사용되기 때문에 마크다운으로 작성된 문서 자체만으로도 충분히 내용을 파악하는데 큰 어려움이 없다.

그리고 마크다운 편집기등을 이용할 경우 현재 작성되고 있는 문서를 타이핑하는 즉시 변환된 화면으로 볼수 있기 때문에 훨씬 효율적인 문서 작성을 할수 있다. (이글은 Markdown pro App으로 작성되었다)

마크다운은 하루프레스뿐 아니라 다양한 곳에서 사용되며 wiki문서에서도 사용된다. (단 위키전용 마크다운문법이 존재한다) 즉 마크다운을 익혀두면 두루두루 편하고 유용히 사용될 날이 있을 것이다.

하루프레스에서 지원하는 멀티 마크다운 문법

하루프레스에서는 기본적인 마크다운 문법외에도 다양한 마크다운 문법을 지원하면 Youtube동영상 연결도 가능하며 작성된 문서를 웹프리젠테이션으로 전환시켜주기도 한다. ^{^}

하루프레스에서 지원하는 멀티마크다운 및 플러그인 사용법은 하루프레스 공식 홈페이지에 매우 자세히 설명되어 있다.

하루프레스 공식 홈페이지 마크다운 설명 이 링크에 소개된 마크다운 문법을 익힌다면 더욱 재미있고 다이나믹한 포스팅이 가능하게 될것이다.

By Insanehong