Markdown
미리보기
복사됨!
왼쪽에 Markdown을 입력하면 여기서 실시간 미리보기가 표시됩니다...
마크다운(Markdown) 미리보기
왼쪽 창에 마크다운 쓰시면 오른쪽에 렌더링 결과가 실시간으로 뜹니다. 표·코드블록까지 대부분 문법 다 받아요.
마크다운 작성이 실제로 어떻게 보이는지 바로 확인
마크다운은 깃허브 README·노션·티스토리·옵시디언에서 두루 쓰는 가벼운 마크업 문법이에요. '#'으로 제목, '**...**'로 굵은체, '```'로 코드블록 처럼 기호 몇 개만 알면 서식이 잡히거든요. 근데 막상 쓰다 보면 '이게 진짜 제목으로 렌더링되나?' 헷갈릴 때가 많죠.
여기는 좌우 분할 화면이에요. 왼쪽에서 타이핑하면 오른쪽에 HTML로 렌더된 결과가 동시에 그려집니다. 제목·굵게·기울임·코드블록·표·순서 목록·인용구·링크·이미지까지 보편적인 문법은 거의 다 처리하고, 외부 라이브러리를 안 불러와서 오프라인에서도 돌아가요.
다른 마크다운 편집기랑 비교
| 항목 | 사장나라 | Dillinger.io | StackEdit |
|---|---|---|---|
| 브라우저 기반 | 예 | 예 (서버) | 예 (서버) |
| 계정 필요 | 아니요 | 아니요 | 구글/깃허브 로그인 |
| 실시간 미리보기 | 예 | 예 | 예 |
| 표 지원 | 예 | 예 | 예 |
| HTML 복사 | 예 | 내보내기만 | 내보내기만 |
| 외부 라이브러리 | 없음 | marked.js | 여러 개 |
| 다크 테마 | 예 | 아니요 | 선택 |
쓰는 법
- 마크다운 작성 - 왼쪽 편집창에 마크다운 문법으로 글을 쓰거나 붙여넣으세요.
- 오른쪽에서 확인 - 타이핑하는 동안 오른쪽 창이 자동으로 갱신됩니다.
- 모든 문법 다 돼요 - # 제목, **굵게**, *기울임*, ``` 코드블록, | 표 |, 순서/비순서 목록, > 인용, 링크, 이미지 전부 먹힙니다.
- MD 복사 - 'MD 복사' 누르시면 원본 마크다운 텍스트가 복사돼요.
- HTML 복사 - 'HTML 복사'를 누르면 렌더링된 HTML 결과물이 복사됩니다.
어떤 점이 편하냐면
- 키 누르는 순간 바로 갱신돼요. 빌드나 컴파일 기다릴 필요 없이 타이핑 속도 그대로 보입니다.
- 제목·굵게·기울임·코드블록·표·목록·인용·링크·이미지·수평선까지 대부분 문법을 처리합니다.
- 외부 마크다운 라이브러리(marked.js 같은 거)를 안 불러와요. 네트워크 끊어도 동작합니다.
- 다크 테마라 오래 봐도 눈이 덜 피로해요.
- 원본 마크다운으로도, 렌더된 HTML로도 한 번에 복사됩니다. 블로그에 옮겨 붙이기 편해요.
- 모든 처리가 브라우저에서 돌아가서 서버로는 한 글자도 안 올라갑니다.
자주 묻는 질문
어떤 마크다운 문법까지 먹혀요?
제목(# ~ ######), 굵게(**텍스트**), 기울임(*텍스트*), 취소선(~~텍스트~~), 인라인 코드(`코드`), 코드블록(```), 인용구(>), 비순서 목록(- *), 순서 목록(1.), 링크, 이미지, 표, 수평선(---)까지 보편 문법은 다 처리합니다.
외부 마크다운 라이브러리 끌어다 쓰는 거예요?
아니요, 파서를 자체적으로 구현해서 브라우저에서 돌아가요. marked.js나 showdown 같은 외부 라이브러리를 안 불러오기 때문에 오프라인 환경에서도 그대로 됩니다.
렌더링된 HTML도 뽑아갈 수 있어요?
네, 'HTML 복사' 버튼이 따로 있어요. 누르시면 렌더된 HTML 코드가 클립보드로 들어가서 HTML 파일이나 에디터에 바로 붙여넣을 수 있습니다.
제가 쓴 글 어딘가 저장되나요?
아니요, 전부 브라우저 메모리에만 있다가 탭 닫으면 사라집니다. 로컬에 저장되지도 않아요.
깃허브 GFM 문법 지원하나요?
표·취소선·코드블록 같은 주요 GFM 문법은 대부분 처리합니다. 체크박스 목록([ ])이나 URL 자동 링크 같은 일부 고급 GFM 기능은 아직 미지원이에요.