실시간 Markdown 에디터 & 렌더러 — 입력과 동시에 HTML로 변환 · 외부 라이브러리 없음
마크다운(Markdown)은 2004년 존 그루버(John Gruber)와 아론 스워츠(Aaron Swartz)가 만든 경량 마크업 언어입니다. 일반 텍스트에 간단한 기호를 추가하여 서식을 표현하고, 이를 HTML로 변환할 수 있습니다. 복잡한 HTML 태그를 몰라도 몇 가지 규칙만 익히면 깔끔한 문서를 빠르게 작성할 수 있다는 것이 최대 장점입니다.
마크다운은 README 파일, 기술 문서, 블로그 포스트, 이슈 트래커, 위키 등 다양한 곳에서 사용됩니다. GitHub, GitLab, Notion, Velog, Obsidian 등 현대 개발 도구 대부분이 마크다운을 기본 형식으로 채택하고 있습니다.
| 문법 | 입력 예시 | 결과 |
|---|---|---|
| H1 제목 | # 제목 | 가장 큰 제목 |
| H2 제목 | ## 소제목 | 중간 제목 |
| H3 제목 | ### 소소제목 | 작은 제목 |
| 굵게 | **텍스트** | 굵은 글씨 |
| 기울기 | *텍스트* | 이탤릭체 |
| 굵은 기울기 | ***텍스트*** | 굵은 이탤릭 |
| 취소선 | ~~텍스트~~ | 취소선 |
| 인라인 코드 | `코드` | 인라인 코드 블록 |
| 코드 블록 | ```언어\n코드\n``` | 코드 블록 |
| 하이퍼링크 | [제목](URL) | 클릭 가능한 링크 |
| 이미지 |  | 이미지 삽입 |
| 순서 없는 목록 | - 항목 | 불릿 목록 |
| 순서 있는 목록 | 1. 항목 | 번호 목록 |
| 인용문 | > 인용 내용 | 들여쓰기 인용 |
| 구분선 | --- | 수평선 |
| 표 | | 열1 | 열2 | | 테이블 |
| 체크박스 | - [x] 완료 | 체크된 체크박스 |
| 각주 | 텍스트[^1] | 각주 참조 |
| 줄바꿈 | 문장 끝에 공백 2개 | 강제 줄바꿈 |
| 이스케이프 | \*별표 그대로\* | 특수문자 그대로 출력 |
GitHub에서 저장소 루트에 README.md 파일을 만들면 저장소 메인 페이지에 자동으로 렌더링됩니다. 좋은 README는 프로젝트의 첫인상이며, 사용자와 기여자를 끌어들이는 핵심 역할을 합니다.
# 프로젝트 이름 간단한 설명 한 줄 ## 설치 방법 ```bash npm install my-package ``` ## 사용 예시 ```javascript const pkg = require('my-package'); pkg.doSomething(); ``` ## 라이선스 MIT
마크다운은 이제 한국 개발자 생태계에서도 표준에 가까운 문서 작성 방식이 되었습니다.
마크다운에서 줄바꿈을 하려면 줄 사이에 빈 줄을 넣어야 합니다. 단순히 엔터 한 번은 같은 단락으로 처리됩니다.
코드 블록 시작에 언어 이름을 지정하면 신택스 하이라이팅이 적용됩니다. ` ```python `, ` ```javascript `, ` ```bash ` 등을 활용하세요.
GitHub README에서 이미지를 삽입할 때는 절대 URL보다 저장소 내 상대 경로를 사용하면 이미지가 깨질 걱정이 없습니다. 처럼 작성하세요.