본문 바로가기

Markdown AST 탐색기

브라우저 처리

Markdown을 제목·문단·목록·인용·코드·구분선 단위의 노드 목록으로 나눠 종류, 줄 번호, 제목 단계, 코드 언어, 체크 여부를 보여 줍니다.

사용 전 확인
  • 파일·이미지·문서 처리 도구는 브라우저 안에서 처리되더라도 원본에 개인정보나 민감 정보가 포함될 수 있습니다. 공유·제출 전 원본과 결과를 한 번 더 확인하세요.
도구 실행입력 후 결과 확인
Markdown AST 탐색기 샘플 실행

Markdown 처리 프로그램은 글을 먼저 '제목', '문단', '목록 항목' 같은 노드로 나눈 구조(AST)로 읽습니다. 이 탐색기는 문서가 어떤 노드로 해석되는지 한 줄씩 보여 줘, 목록이 문단으로 읽히거나 코드가 끊기는 문제를 구조 단위로 확인하게 해 줍니다.

브라우저 처리
샘플 결과
0	heading	1행	depth=1	제목
1	paragraph	2행	본문 **굵게**
2	listItem	3행	checked=true	완료
3	listItem	4행	첫째
4	blockquote	5행	인용
5	code	6행	lang=js	let a = 1;
6	thematicBreak	9행
자바스크립트가 활성화되면 이 영역이 실제 입력, 실행, 결과 패널로 바뀝니다.

Markdown AST 탐색기 사용 가이드

Markdown 처리 프로그램은 글을 먼저 '제목', '문단', '목록 항목' 같은 노드로 나눈 구조(AST)로 읽습니다. 이 탐색기는 문서가 어떤 노드로 해석되는지 한 줄씩 보여 줘, 목록이 문단으로 읽히거나 코드가 끊기는 문제를 구조 단위로 확인하게 해 줍니다.

각 줄에는 노드 번호, 종류(heading, paragraph, listItem, blockquote, code, thematicBreak), 원문 줄 번호가 나오고, 제목은 depth(단계), 코드 블록은 lang(언어), 체크박스 목록은 checked(완료 여부)가 붙습니다. 코드 블록은 펜스 안 전체가 노드 하나로 묶이며 첫 줄만 표시됩니다.

인라인 서식(굵게, 링크)은 따로 나누지 않고 값 안에 그대로 둡니다. 표준 Markdown 파서보다 단순한 구조이므로 학습·점검용으로 쓰세요.

사용 방법

  1. '.md·.txt 파일'에서 문서를 고르거나 'Markdown 내용'에 구조를 볼 Markdown을 붙여 넣습니다.
  2. '실행'을 누르면 노드마다 번호, 종류, 줄 번호, 속성, 내용이 한 줄씩 나옵니다.
  3. 예상과 다른 종류로 읽힌 줄을 찾아 원문 문법을 고칩니다.

예시: 여러 블록이 섞인 문서

입력
# 제목
본문 **굵게**
- [x] 완료
1. 첫째
> 인용
```js
let a = 1;
```
---
결과
0	heading	1행	depth=1	제목
1	paragraph	2행	본문 **굵게**
2	listItem	3행	checked=true	완료
3	listItem	4행	첫째
4	blockquote	5행	인용
5	code	6행	lang=js	let a = 1;
6	thematicBreak	9행	

코드 블록 세 줄(6~8행)은 노드 하나로 묶였고, 굵게 표시는 문단 값 안에 그대로 남습니다.

이럴 때 쓰면 좋아요

  • Markdown 파서가 문서를 어떻게 나누는지 배울 때
  • 목록이 문단으로 읽히는 원인을 줄 단위로 찾을 때
  • 문서 변환 스크립트를 만들기 전에 구조를 확인할 때
  • 체크리스트의 완료 항목이 제대로 인식되는지 볼 때

문제가 생겼을 때

목록인데 paragraph로 나옴

- 나 1. 뒤에 공백이 없으면 목록이 아닙니다. '-항목'을 '- 항목'으로 고치세요.

코드 블록이 끝까지 이어짐

닫는 ```가 없거나 여는 펜스보다 짧으면 문서 끝까지 코드로 읽힙니다. Markdown 코드 펜스 언어 검사기로 닫히지 않은 블록을 찾으세요.

활용 팁

  • 구조를 JSON으로 저장하거나 다시 Markdown으로 되돌리려면 Markdown ↔ JSON AST 변환기를 쓰세요. 같은 노드 규칙을 씁니다.
  • 결과는 탭으로 나뉘어 표 계산기에 붙이면 종류별로 필터해 제목·목록 개수를 셀 수 있습니다.

자주 묻는 질문

번호 목록과 글머리 목록을 구분하나요?

탐색기 목록에는 둘 다 listItem으로 나오지만, JSON AST 변환 결과에는 번호 목록에 ordered: true가 붙습니다.

표는 어떤 노드가 되나요?

표 전용 노드는 없고 각 줄이 paragraph로 나옵니다. 표 구조 확인은 Markdown 표 포맷터를 쓰세요.

노드 번호는 무엇인가요?

문서에 나온 순서대로 0부터 매긴 번호입니다. JSON AST의 children 배열 순서와 같습니다.