미리보기 결과가 여기에 표시됩니다
도구 설명
Markdown 미리보기 정보
Markdown Preview는 Markdown 원본을 읽기 쉬운 미리보기로 렌더링해 제목, 목록, 링크, 인용, 표, 코드 블록을 확인하게 합니다.
README, 문서 조각, 이슈, 블로그 초안을 제출하기 전에 빠르게 점검할 때 사용합니다.
Markdown Preview 사용 방법
- Markdown 원본을 붙여 넣습니다.
- 샘플로 GFM 표, 펜스 코드 블록, 링크 렌더링을 확인합니다.
- 제목 계층, 목록 들여쓰기, 링크 표시를 검토합니다.
사용 사례
- README의 코드 블록 언어와 표 정렬을 커밋 전에 확인합니다.
- GitHub 이슈나 릴리스 노트를 게시 전 미리보기합니다.
- API 문서 조각의 제목과 목록 중첩을 확인합니다.
Markdown 구문과 자주 깨지는 표기
Markdown은 가볍지만 빈 줄, 들여쓰기, 백틱 개수가 렌더링에 영향을 줍니다. GitHub Flavored Markdown은 표, 작업 목록, 펜스 코드 블록을 추가합니다.
- 제목은 #을 쓰며 논리적인 계층을 유지해야 합니다.
- 중첩 목록은 들여쓰기에 의존하고 탭과 공백을 섞으면 레이아웃이 깨지기 쉽습니다.
- 펜스 코드 블록은 백틱 3개로 감싸며 언어 이름을 지정할 수 있습니다.
- 링크 텍스트는 “여기를 클릭” 대신 내용을 설명하도록 작성하세요.
Markdown 미리보기 자주 묻는 질문
- GitHub Flavored Markdown을 지원하나요?
- 표, 펜스 코드 블록, 작업 목록 같은 자주 쓰는 GFM 기능은 미리보기할 수 있지만 최종 렌더링은 대상 플랫폼에 따라 다릅니다.
- 중첩 목록이 왜 적용되지 않나요?
- 대개 들여쓰기나 빈 줄 문제입니다. 하위 목록 항목을 상위보다 더 들여쓰기하고 기호 스타일을 맞추세요.
- Content가 업로드되나요?
- 아니요. Markdown 렌더링은 브라우저에서 로컬로 실행되고 wetool.site로 업로드되지 않습니다.
Markdown Preview와 게시
미리보기는 대부분의 표시 문제를 잡지만 GitHub, npm, 포럼, CMS는 서로 다른 Markdown 확장과 새니타이저를 쓸 수 있습니다. 게시 전 대상 플랫폼에서 다시 확인하세요.
Markdown 방언 비교
미리보기 도구는 구조 문제를 찾는 데 도움이 되지만 플랫폼마다 Markdown 방언이 다릅니다.
- CommonMark는 제목, 문단, 목록, 인용, 코드 블록 같은 기본 구문을 다룹니다.
- GitHub Flavored Markdown은 표, 작업 목록, 취소선, 자동 링크 같은 자주 쓰는 확장을 추가합니다.
- 블로그, CMS, 문서 사이트는 front matter, 제목 앵커, 각주, 수식을 추가로 지원할 수 있습니다.
안전한 렌더링과 게시 경계
Markdown 미리보기는 최종 게시 환경이 아니며 HTML, 이미지, 외부 링크, 플랫폼 필터를 주의해야 합니다.
- 신뢰할 수 없는 Markdown을 안전한 HTML로 취급하지 마세요. 대상 플랫폼는 보통 원시 HTML을 sanitize합니다.
- 외부 이미지와 links는 게시 후 요청 출처, 토큰 매개변수, 내부 주소를 노출할 수 있습니다.
- README, npm 문서, CMS 페이지를 게시하기 전에 대상 플랫폼에서 최종 렌더링을 다시 확인하세요.