마크다운 미리보기란
마크다운(Markdown)은 일반 텍스트로 제목·목록·링크·강조 등 서식을 간단하게 표현하는 경량 마크업 문법입니다. 이 도구는 왼쪽에 마크다운을 입력하면 오른쪽에 실시간으로 변환된 결과(HTML)를 보여 주고, 필요하면 변환된 HTML 소스를 확인하고 복사할 수 있습니다. 입력 내용은 브라우저에서만 처리되어 외부로 전송되지 않습니다.
마크다운 문법
# 제목~###### 제목: 1~6단계 제목**굵게**,*기울임*,~~취소선~~: 텍스트 강조- 항목또는1. 항목: 글머리·번호 목록[링크](https://example.com),: 링크·이미지> 인용문: 인용 블록`코드`와```로 감싼 코드 블록- 표(GFM):
| 머리 | 머리 |와| --- | --- |구분선
어떻게 변환되나 — 동작 원리
마크다운은 그 자체로는 서식이 적용되지 않는 일반 텍스트입니다. 이 도구는 입력한 마크다운을 파서로 읽어 대응하는 HTML 태그(제목은 <h1>, 목록은 <ul>·<li>, 강조는 <strong> 등)로 바꾼 뒤 오른쪽에 실시간으로 그려 줍니다. 입력이 바뀔 때마다 즉시 다시 변환되므로 결과를 바로 확인하며 글을 다듬을 수 있습니다. 변환된 HTML은 화면에 넣기 전 정화(sanitize) 과정을 거쳐 <script> 같은 위험한 태그를 걸러 내므로, 미리보기가 안전하게 표시됩니다.
실무 활용 예시
- 블로그·문서 작성 : 마크다운으로 빠르게 글을 쓰고, 변환된 HTML을 복사해 게시판이나 CMS에 붙여넣습니다.
- README·기술 문서 : 제목·목록·코드 블록·표를 조합해 정리하고 결과를 미리 확인합니다.
- HTML 파일로 내보내기 : 기본 스타일이 포함된 완성형
.html파일로 저장해 그대로 열어 볼 수 있습니다. - 서식 미리보기 : 표(GFM)나 코드 블록이 실제로 어떻게 보일지 발행 전에 점검합니다.
상단 툴바의 B·I·제목·링크·코드 버튼을 쓰면 선택한 텍스트에 마크다운 문법을 자동으로 감싸 주어, 문법을 외우지 않아도 서식을 넣을 수 있습니다.
주의점·팁
입력한 내용은 브라우저 메모리에서만 처리되며 저장되지 않으므로, 페이지를 새로고침하면 초기화됩니다. 필요한 결과는 .md·.html 다운로드나 HTML 복사로 미리 보관하세요. 표를 만들 때는 머리글 아래에 | --- | --- | 구분선이 반드시 있어야 표로 인식됩니다. 마크다운 방언마다 세부 문법이 조금씩 다를 수 있으니, 결과가 예상과 다르면 문법을 확인해 보세요.
마크다운의 장점은 글의 내용과 서식이 한 텍스트 안에 자연스럽게 녹아 있어, 워드 같은 편집기 없이도 구조가 잡힌 문서를 빠르게 쓸 수 있다는 점입니다. 깃허브 README, 기술 블로그, 이슈·댓글 등 개발자가 매일 접하는 많은 곳이 마크다운을 지원합니다. 이 도구로 미리보기를 보며 작성하면 발행 후 서식이 깨지는 실수를 줄일 수 있고, 완성한 글은 마크다운 원본과 변환된 HTML 두 형태로 가져갈 수 있습니다. 왼쪽 편집창과 오른쪽 미리보기는 스크롤이 서로 연동되어 긴 문서도 편하게 훑어볼 수 있습니다.
자주 묻는 질문
입력한 내용이 서버로 전송되나요?
아니요. 모든 변환은 브라우저 안에서만 실행되며 입력한 마크다운 내용은 서버로 전송되거나 저장되지 않습니다.
변환한 HTML을 가져갈 수 있나요?
네. 'HTML 소스 보기'를 켜면 변환된 HTML 코드가 표시되며, 복사 버튼으로 클립보드에 복사해 블로그·문서 등에 붙여넣을 수 있습니다.
표나 코드 블록도 지원하나요?
네. 제목, 목록, 링크, 이미지, 인용, 코드 블록, 표(GFM) 등 일반적인 마크다운 문법을 지원합니다.
미리보기에 위험한 스크립트가 실행되나요?
아니요. 변환된 HTML은 화면에 넣기 전 정화 과정을 거쳐 script 같은 위험한 태그를 걸러 내므로 미리보기가 안전하게 표시됩니다.
.md나 .html 파일로 저장할 수 있나요?
네. 하단 버튼으로 원본 마크다운은 .md 파일로, 변환 결과는 기본 스타일이 포함된 .html 파일로 내려받을 수 있습니다.
입력한 내용이 저장되나요?
저장되지 않습니다. 페이지를 새로고침하면 내용이 초기화되므로, 필요한 결과는 미리 복사해 두세요.