마크다운연습

2026-10-23T16:23:35Z

Kimseoyun:

<div style="padding:14px 16px; border-left:4px solid #1d4ed8; background:#eff6ff; margin:0 0 24px 0;">
<strong>💡 이 페이지 보는 법</strong><br>
왼쪽은 <code>CLAUDE.md</code> 파일에 실제로 입력된 마크다운 원문이고, 오른쪽은 깃허브나 AI 도구처럼 마크다운을 지원하는 환경에서 그 원문이 보이는 모습입니다. 이 위키는 마크다운을 직접 해석하지 않기 때문에, 오른쪽 화면은 같은 모양을 HTML로 재현한 것입니다.
</div>

{{마크다운비교
|제목=① 문서 제목과 소개문
|문법=제목(#) · 문단
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;"># CLAUDE.md

Behavioral guidelines to reduce common LLM coding mistakes. Merge with project-specific instructions as needed.</pre>
|결과=<div style="font-size:1.6em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">CLAUDE.md</div>
<p style="margin:0;">Behavioral guidelines to reduce common LLM coding mistakes. Merge with project-specific instructions as needed.</p>
}}

{{마크다운비교
|제목=② 강조 문단
|문법=굵게(**)
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">**Tradeoff:** These guidelines bias toward caution over speed. For trivial tasks, use judgment.</pre>
|결과=<p style="margin:0;"><strong>Tradeoff:</strong> These guidelines bias toward caution over speed. For trivial tasks, use judgment.</p>
}}

{{마크다운비교
|제목=③ 1번 원칙
|문법=제목(##) · 굵게 · 목록(-)
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 1. Think Before Coding

**Don't assume. Don't hide confusion. Surface tradeoffs.**

Before implementing:
- State your assumptions explicitly. If uncertain, ask.
- If multiple interpretations exist, present them - don't pick silently.
- If a simpler approach exists, say so. Push back when warranted.
- If something is unclear, stop. Name what's confusing. Ask.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">1. Think Before Coding</div>
<p style="margin:0 0 10px 0;"><strong>Don't assume. Don't hide confusion. Surface tradeoffs.</strong></p>
<p style="margin:0 0 4px 0;">Before implementing:</p>
<ul style="margin:0;">
<li>State your assumptions explicitly. If uncertain, ask.</li>
<li>If multiple interpretations exist, present them - don't pick silently.</li>
<li>If a simpler approach exists, say so. Push back when warranted.</li>
<li>If something is unclear, stop. Name what's confusing. Ask.</li>
</ul>
}}

{{마크다운비교
|제목=④ 2번 원칙
|문법=제목(##) · 굵게 · 목록(-) · 문단
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 2. Simplicity First

**Minimum code that solves the problem. Nothing speculative.**

- No features beyond what was asked.
- No abstractions for single-use code.
- No "flexibility" or "configurability" that wasn't requested.
- No error handling for impossible scenarios.
- If you write 200 lines and it could be 50, rewrite it.

Ask yourself: "Would a senior engineer say this is overcomplicated?" If yes, simplify.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">2. Simplicity First</div>
<p style="margin:0 0 10px 0;"><strong>Minimum code that solves the problem. Nothing speculative.</strong></p>
<ul style="margin:0 0 10px 0;">
<li>No features beyond what was asked.</li>
<li>No abstractions for single-use code.</li>
<li>No "flexibility" or "configurability" that wasn't requested.</li>
<li>No error handling for impossible scenarios.</li>
<li>If you write 200 lines and it could be 50, rewrite it.</li>
</ul>
<p style="margin:0;">Ask yourself: "Would a senior engineer say this is overcomplicated?" If yes, simplify.</p>
}}

{{마크다운비교
|제목=⑤ 3번 원칙
|문법=제목(##) · 굵게 · 목록 두 묶음
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 3. Surgical Changes

**Touch only what you must. Clean up only your own mess.**

When editing existing code:
- Don't "improve" adjacent code, comments, or formatting.
- Don't refactor things that aren't broken.
- Match existing style, even if you'd do it differently.
- If you notice unrelated dead code, mention it - don't delete it.

When your changes create orphans:
- Remove imports/variables/functions that YOUR changes made unused.
- Don't remove pre-existing dead code unless asked.

The test: Every changed line should trace directly to the user's request.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">3. Surgical Changes</div>
<p style="margin:0 0 10px 0;"><strong>Touch only what you must. Clean up only your own mess.</strong></p>
<p style="margin:0 0 4px 0;">When editing existing code:</p>
<ul style="margin:0 0 10px 0;">
<li>Don't "improve" adjacent code, comments, or formatting.</li>
<li>Don't refactor things that aren't broken.</li>
<li>Match existing style, even if you'd do it differently.</li>
<li>If you notice unrelated dead code, mention it - don't delete it.</li>
</ul>
<p style="margin:0 0 4px 0;">When your changes create orphans:</p>
<ul style="margin:0 0 10px 0;">
<li>Remove imports/variables/functions that YOUR changes made unused.</li>
<li>Don't remove pre-existing dead code unless asked.</li>
</ul>
<p style="margin:0;">The test: Every changed line should trace directly to the user's request.</p>
}}

{{마크다운비교
|제목=⑥ 4번 원칙
|문법=제목(##) · 굵게 · 목록 · 코드 블록(```)
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 4. Goal-Driven Execution

**Define success criteria. Loop until verified.**

Transform tasks into verifiable goals:
- "Add validation" → "Write tests for invalid inputs, then make them pass"
- "Fix the bug" → "Write a test that reproduces it, then make it pass"
- "Refactor X" → "Ensure tests pass before and after"

For multi-step tasks, state a brief plan:
```
1. [Step] → verify: [check]
2. [Step] → verify: [check]
3. [Step] → verify: [check]
```

Strong success criteria let you loop independently. Weak criteria ("make it work") require constant clarification.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">4. Goal-Driven Execution</div>
<p style="margin:0 0 10px 0;"><strong>Define success criteria. Loop until verified.</strong></p>
<p style="margin:0 0 4px 0;">Transform tasks into verifiable goals:</p>
<ul style="margin:0 0 10px 0;">
<li>"Add validation" → "Write tests for invalid inputs, then make them pass"</li>
<li>"Fix the bug" → "Write a test that reproduces it, then make it pass"</li>
<li>"Refactor X" → "Ensure tests pass before and after"</li>
</ul>
<p style="margin:0 0 4px 0;">For multi-step tasks, state a brief plan:</p>
<pre style="margin:0 0 10px 0; padding:12px; white-space:pre-wrap; font-size:13px; background:#f6f8fa; border:none; border-radius:6px;">1. [Step] → verify: [check]
2. [Step] → verify: [check]
3. [Step] → verify: [check]</pre>
<p style="margin:0;">Strong success criteria let you loop independently. Weak criteria ("make it work") require constant clarification.</p>
}}

{{마크다운비교
|제목=⑦ 맺음말
|문법=구분선(---) · 굵게
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">---

**These guidelines are working if:** fewer unnecessary changes in diffs, fewer rewrites due to overcomplication, and clarifying questions come before implementation rather than after mistakes.</pre>
|결과=<hr style="border:none; border-top:2px solid #d0d7de; margin:0 0 12px 0;">
<p style="margin:0;"><strong>These guidelines are working if:</strong> fewer unnecessary changes in diffs, fewer rewrites due to overcomplication, and clarifying questions come before implementation rather than after mistakes.</p>
}}

----
== 실습: 우리 팀 README.md 초안 쓰기 ==
<div style="padding:14px 16px; border-left:4px solid #1d4ed8; background:#eff6ff; margin:0 0 16px 0;">
<strong>💡 README.md란?</strong><br>
깃허브 저장소에 들어갔을 때 가장 먼저 보이는 소개 문서입니다. 우리 팀 프로젝트가 <strong>무엇을, 어떤 데이터로, 어떻게</strong> 만드는지 처음 보는 사람에게 설명합니다.
</div>
<div style="display:flex; align-items:flex-start; margin:0 0 8px 0;"><span style="flex:0 0 26px; height:26px; line-height:26px; border-radius:50%; background:#dc2626; color:#fff; text-align:center; font-weight:700; margin-right:10px;">1</span><div>아래 예시에서 왼쪽 원문의 기호가 오른쪽에서 어떻게 바뀌는지 확인합니다.</div></div>
<div style="display:flex; align-items:flex-start; margin:0 0 8px 0;"><span style="flex:0 0 26px; height:26px; line-height:26px; border-radius:50%; background:#dc2626; color:#fff; text-align:center; font-weight:700; margin-right:10px;">2</span><div>맨 아래 <strong>빈 틀</strong>을 복사해 마크다운 편집기(깃허브 웹 편집기 등)에 붙여 넣고, 팀 프로젝트 내용으로 채웁니다.</div></div>
{{마크다운비교
|제목=예시: 가상의 팀 README
|문법=제목 · 굵게 · 목록 · 링크 · 표 · 체크리스트
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;"># 서원지기: 조선 서원 배향 인물 지식그래프

## 1. 프로젝트 소개
우리 팀은 **조선시대 서원 기록**을 바탕으로 서원과 배향 인물, 학맥의 관계를 지식그래프로 구축합니다.

## 2. 팀원
- 김가람 (사학과) — 데이터 수집
- 이나래 (국어국문학과) — 그래프 설계
- 박다온 (철학과) — 시각화·해석

## 3. 데이터 출처
- [한국학자료센터](https://kostma.aks.ac.kr)

## 4. 그래프 설계
| 노드 | 주요 속성 |
|---|---|
| Person | name, birth, death |
| Seowon | name, region |

## 5. 진행 상황
- [x] 데이터셋 선정
- [ ] 노드·관계 설계
- [ ] 중간발표 준비</pre>
|결과=<div style="font-size:1.6em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">서원지기: 조선 서원 배향 인물 지식그래프</div>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">1. 프로젝트 소개</div>
<p style="margin:0 0 12px 0;">우리 팀은 <strong>조선시대 서원 기록</strong>을 바탕으로 서원과 배향 인물, 학맥의 관계를 지식그래프로 구축합니다.</p>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">2. 팀원</div>
<ul style="margin:0 0 12px 0;">
<li>김가람 (사학과) — 데이터 수집</li>
<li>이나래 (국어국문학과) — 그래프 설계</li>
<li>박다온 (철학과) — 시각화·해석</li>
</ul>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">3. 데이터 출처</div>
<ul style="margin:0 0 12px 0;">
<li><span style="color:#1d4ed8; text-decoration:underline;">한국학자료센터</span></li>
</ul>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">4. 그래프 설계</div>
<table class="plan" style="width:100%; border-collapse:collapse; margin:0 0 12px 0;">
<tr><th style="border:1px solid #d0d7de; padding:4px 8px; background:#f6f8fa; text-align:left;">노드</th><th style="border:1px solid #d0d7de; padding:4px 8px; background:#f6f8fa; text-align:left;">주요 속성</th></tr>
<tr><td style="border:1px solid #d0d7de; padding:4px 8px;">Person</td><td style="border:1px solid #d0d7de; padding:4px 8px;">name, birth, death</td></tr>
<tr><td style="border:1px solid #d0d7de; padding:4px 8px;">Seowon</td><td style="border:1px solid #d0d7de; padding:4px 8px;">name, region</td></tr>
</table>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">5. 진행 상황</div>
<div style="margin:0 0 4px 0;">☑ 데이터셋 선정</div>
<div style="margin:0 0 4px 0;">☐ 노드·관계 설계</div>
<div style="margin:0;">☐ 중간발표 준비</div>
}}

마크다운연습

2026-10-23T16:21:54Z

Kimseoyun:

<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>마크다운 실시간 연습장</title>
<style>
:root{--blue:#1d4ed8;--line:#cbd5e1;--bg:#f8fafc;--ink:#1f2937;--muted:#64748b}
*{box-sizing:border-box}
body{margin:0;font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:var(--ink);background:#fff}
header{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
header h1{font-size:18px;margin:0 12px 0 0}
button{font:inherit;font-size:13px;padding:6px 12px;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:pointer}
button:hover{border-color:var(--blue);color:var(--blue)}
button.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.wrap{display:grid;grid-template-columns:1fr 1fr;height:calc(100vh - 62px)}
.pane{display:flex;flex-direction:column;min-height:0}
.pane+.pane{border-left:1px solid var(--line)}
.label{font-size:12px;font-weight:700;padding:8px 16px;border-bottom:1px solid var(--line);background:var(--bg);color:var(--muted)}
.pane:last-child .label{color:var(--blue)}
textarea{flex:1;border:0;resize:none;padding:16px;font:14px/1.6 "D2Coding",Consolas,monospace;background:#fafafa;outline:none}
#out{flex:1;overflow:auto;padding:16px 24px;line-height:1.6}
#out h1,#out h2{border-bottom:1px solid #d0d7de;padding-bottom:4px}
#out h1{font-size:1.6em}#out h2{font-size:1.3em}
#out code{background:#eff1f3;padding:1px 5px;border-radius:4px;font-size:90%}
#out pre{background:#f6f8fa;padding:12px;border-radius:6px;overflow:auto}
#out pre code{background:none;padding:0}
#out table{border-collapse:collapse}
#out th,#out td{border:1px solid #d0d7de;padding:4px 10px}
#out th{background:#f6f8fa}
#out blockquote{margin:0;padding:0 14px;border-left:4px solid #d0d7de;color:#57606a}
#out a{color:var(--blue)}
#out li:has(>input[type=checkbox]){list-style:none;margin-left:-1.2em}
#out hr{border:0;border-top:2px solid #d0d7de}
@media (max-width:720px){.wrap{grid-template-columns:1fr;height:auto}.pane+.pane{border-left:0;border-top:1px solid var(--line)}textarea{min-height:45vh}#out{min-height:45vh}}
</style>
</head>
<body>
<header>
<h1>📝 마크다운 실시간 연습장</h1>
<button data-preset="claude">CLAUDE.md 예시</button>
<button data-preset="example">README 예시</button>
<button data-preset="blank">README 빈 틀</button>
<button id="clear">비우기</button>
<button id="save" class="primary">README.md로 저장</button>
</header>
<div class="wrap">
<div class="pane"><div class="label">✏️ 입력 (.md 원문) — 여기에 작성하세요</div><textarea id="src" spellcheck="false"></textarea></div>
<div class="pane"><div class="label">👀 결과 (렌더링 화면) — 입력하는 즉시 바뀝니다</div><div id="out"></div></div>
</div>
<script>/**
* marked v12.0.2 - a markdown parser
* Copyright (c) 2011-2024, Christopher Jeffrey. (MIT Licensed)
* https://github.com/markedjs/marked
*/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).marked={})}(this,(function(e){"use strict";function t(){return{async:!1,breaks:!1,extensions:null,gfm:!0,hooks:null,pedantic:!1,renderer:null,silent:!1,tokenizer:null,walkTokens:null}}function n(t){e.defaults=t}e.defaults={async:!1,breaks:!1,extensions:null,gfm:!0,hooks:null,pedantic:!1,renderer:null,silent:!1,tokenizer:null,walkTokens:null};const s=/[&<>"']/,r=new RegExp(s.source,"g"),i=/[<>"']|&(?!(#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/,l=new RegExp(i.source,"g"),o={"&":"&","<":"<",">":">",'"':""","'":"'"},a=e=>o[e];function c(e,t){if(t){if(s.test(e))return e.replace(r,a)}else if(i.test(e))return e.replace(l,a);return e}const h=/&(#(?:\d+)|(?:#x[0-9A-Fa-f]+)|(?:\w+));?/gi;function p(e){return e.replace(h,((e,t)=>"colon"===(t=t.toLowerCase())?":":"#"===t.charAt(0)?"x"===t.charAt(1)?String.fromCharCode(parseInt(t.substring(2),16)):String.fromCharCode(+t.substring(1)):""))}const u=/(^|[^\[])\^/g;function k(e,t){let n="string"==typeof e?e:e.source;t=t||"";const s={replace:(e,t)=>{let r="string"==typeof t?t:t.source;return r=r.replace(u,"$1"),n=n.replace(e,r),s},getRegex:()=>new RegExp(n,t)};return s}function g(e){try{e=encodeURI(e).replace(/%25/g,"%")}catch(e){return null}return e}const f={exec:()=>null};function d(e,t){const n=e.replace(/\|/g,((e,t,n)=>{let s=!1,r=t;for(;--r>=0&&"\\"===n[r];)s=!s;return s?"|":" |"})).split(/ \|/);let s=0;if(n[0].trim()||n.shift(),n.length>0&&!n[n.length-1].trim()&&n.pop(),t)if(n.length>t)n.splice(t);else for(;n.length<t;)n.push("");for(;s<n.length;s++)n[s]=n[s].trim().replace(/\\\|/g,"|");return n}function x(e,t,n){const s=e.length;if(0===s)return"";let r=0;for(;r<s;){const i=e.charAt(s-r-1);if(i!==t||n){if(i===t||!n)break;r++}else r++}return e.slice(0,s-r)}function b(e,t,n,s){const r=t.href,i=t.title?c(t.title):null,l=e[1].replace(/\\([\[\]])/g,"$1");if("!"!==e[0].charAt(0)){s.state.inLink=!0;const e={type:"link",raw:n,href:r,title:i,text:l,tokens:s.inlineTokens(l)};return s.state.inLink=!1,e}return{type:"image",raw:n,href:r,title:i,text:c(l)}}class w{options;rules;lexer;constructor(t){this.options=t||e.defaults}space(e){const t=this.rules.block.newline.exec(e);if(t&&t[0].length>0)return{type:"space",raw:t[0]}}code(e){const t=this.rules.block.code.exec(e);if(t){const e=t[0].replace(/^ {1,4}/gm,"");return{type:"code",raw:t[0],codeBlockStyle:"indented",text:this.options.pedantic?e:x(e,"\n")}}}fences(e){const t=this.rules.block.fences.exec(e);if(t){const e=t[0],n=function(e,t){const n=e.match(/^(\s+)(?:```)/);if(null===n)return t;const s=n[1];return t.split("\n").map((e=>{const t=e.match(/^\s+/);if(null===t)return e;const[n]=t;return n.length>=s.length?e.slice(s.length):e})).join("\n")}(e,t[3]||"");return{type:"code",raw:e,lang:t[2]?t[2].trim().replace(this.rules.inline.anyPunctuation,"$1"):t[2],text:n}}}heading(e){const t=this.rules.block.heading.exec(e);if(t){let e=t[2].trim();if(/#$/.test(e)){const t=x(e,"#");this.options.pedantic?e=t.trim():t&&!/ $/.test(t)||(e=t.trim())}return{type:"heading",raw:t[0],depth:t[1].length,text:e,tokens:this.lexer.inline(e)}}}hr(e){const t=this.rules.block.hr.exec(e);if(t)return{type:"hr",raw:t[0]}}blockquote(e){const t=this.rules.block.blockquote.exec(e);if(t){let e=t[0].replace(/\n {0,3}((?:=+|-+) *)(?=\n|$)/g,"\n $1");e=x(e.replace(/^ *>[ \t]?/gm,""),"\n");const n=this.lexer.state.top;this.lexer.state.top=!0;const s=this.lexer.blockTokens(e);return this.lexer.state.top=n,{type:"blockquote",raw:t[0],tokens:s,text:e}}}list(e){let t=this.rules.block.list.exec(e);if(t){let n=t[1].trim();const s=n.length>1,r={type:"list",raw:"",ordered:s,start:s?+n.slice(0,-1):"",loose:!1,items:[]};n=s?`\\d{1,9}\\${n.slice(-1)}`:`\\${n}`,this.options.pedantic&&(n=s?n:"[*+-]");const i=new RegExp(`^( {0,3}${n})((?:[\t ][^\\n]*)?(?:\\n|$))`);let l="",o="",a=!1;for(;e;){let n=!1;if(!(t=i.exec(e)))break;if(this.rules.block.hr.test(e))break;l=t[0],e=e.substring(l.length);let s=t[2].split("\n",1)[0].replace(/^\t+/,(e=>" ".repeat(3*e.length))),c=e.split("\n",1)[0],h=0;this.options.pedantic?(h=2,o=s.trimStart()):(h=t[2].search(/[^ ]/),h=h>4?1:h,o=s.slice(h),h+=t[1].length);let p=!1;if(!s&&/^ *$/.test(c)&&(l+=c+"\n",e=e.substring(c.length+1),n=!0),!n){const t=new RegExp(`^ {0,${Math.min(3,h-1)}}(?:[*+-]|\\d{1,9}[.)])((?:[ \t][^\\n]*)?(?:\\n|$))`),n=new RegExp(`^ {0,${Math.min(3,h-1)}}((?:- *){3,}|(?:_ *){3,}|(?:\\* *){3,})(?:\\n+|$)`),r=new RegExp(`^ {0,${Math.min(3,h-1)}}(?:\`\`\`|~~~)`),i=new RegExp(`^ {0,${Math.min(3,h-1)}}#`);for(;e;){const a=e.split("\n",1)[0];if(c=a,this.options.pedantic&&(c=c.replace(/^ {1,4}(?=( {4})*[^ ])/g," ")),r.test(c))break;if(i.test(c))break;if(t.test(c))break;if(n.test(e))break;if(c.search(/[^ ]/)>=h||!c.trim())o+="\n"+c.slice(h);else{if(p)break;if(s.search(/[^ ]/)>=4)break;if(r.test(s))break;if(i.test(s))break;if(n.test(s))break;o+="\n"+c}p||c.trim()||(p=!0),l+=a+"\n",e=e.substring(a.length+1),s=c.slice(h)}}r.loose||(a?r.loose=!0:/\n *\n *$/.test(l)&&(a=!0));let u,k=null;this.options.gfm&&(k=/^\[[ xX]\] /.exec(o),k&&(u="[ ] "!==k[0],o=o.replace(/^\[[ xX]\] +/,""))),r.items.push({type:"list_item",raw:l,task:!!k,checked:u,loose:!1,text:o,tokens:[]}),r.raw+=l}r.items[r.items.length-1].raw=l.trimEnd(),r.items[r.items.length-1].text=o.trimEnd(),r.raw=r.raw.trimEnd();for(let e=0;e<r.items.length;e++)if(this.lexer.state.top=!1,r.items[e].tokens=this.lexer.blockTokens(r.items[e].text,[]),!r.loose){const t=r.items[e].tokens.filter((e=>"space"===e.type)),n=t.length>0&&t.some((e=>/\n.*\n/.test(e.raw)));r.loose=n}if(r.loose)for(let e=0;e<r.items.length;e++)r.items[e].loose=!0;return r}}html(e){const t=this.rules.block.html.exec(e);if(t){return{type:"html",block:!0,raw:t[0],pre:"pre"===t[1]||"script"===t[1]||"style"===t[1],text:t[0]}}}def(e){const t=this.rules.block.def.exec(e);if(t){const e=t[1].toLowerCase().replace(/\s+/g," "),n=t[2]?t[2].replace(/^<(.*)>$/,"$1").replace(this.rules.inline.anyPunctuation,"$1"):"",s=t[3]?t[3].substring(1,t[3].length-1).replace(this.rules.inline.anyPunctuation,"$1"):t[3];return{type:"def",tag:e,raw:t[0],href:n,title:s}}}table(e){const t=this.rules.block.table.exec(e);if(!t)return;if(!/[:|]/.test(t[2]))return;const n=d(t[1]),s=t[2].replace(/^\||\| *$/g,"").split("|"),r=t[3]&&t[3].trim()?t[3].replace(/\n[ \t]*$/,"").split("\n"):[],i={type:"table",raw:t[0],header:[],align:[],rows:[]};if(n.length===s.length){for(const e of s)/^ *-+: *$/.test(e)?i.align.push("right"):/^ *:-+: *$/.test(e)?i.align.push("center"):/^ *:-+ *$/.test(e)?i.align.push("left"):i.align.push(null);for(const e of n)i.header.push({text:e,tokens:this.lexer.inline(e)});for(const e of r)i.rows.push(d(e,i.header.length).map((e=>({text:e,tokens:this.lexer.inline(e)}))));return i}}lheading(e){const t=this.rules.block.lheading.exec(e);if(t)return{type:"heading",raw:t[0],depth:"="===t[2].charAt(0)?1:2,text:t[1],tokens:this.lexer.inline(t[1])}}paragraph(e){const t=this.rules.block.paragraph.exec(e);if(t){const e="\n"===t[1].charAt(t[1].length-1)?t[1].slice(0,-1):t[1];return{type:"paragraph",raw:t[0],text:e,tokens:this.lexer.inline(e)}}}text(e){const t=this.rules.block.text.exec(e);if(t)return{type:"text",raw:t[0],text:t[0],tokens:this.lexer.inline(t[0])}}escape(e){const t=this.rules.inline.escape.exec(e);if(t)return{type:"escape",raw:t[0],text:c(t[1])}}tag(e){const t=this.rules.inline.tag.exec(e);if(t)return!this.lexer.state.inLink&&/^<a /i.test(t[0])?this.lexer.state.inLink=!0:this.lexer.state.inLink&&/^<\/a>/i.test(t[0])&&(this.lexer.state.inLink=!1),!this.lexer.state.inRawBlock&&/^<(pre|code|kbd|script)(\s|>)/i.test(t[0])?this.lexer.state.inRawBlock=!0:this.lexer.state.inRawBlock&&/^<\/(pre|code|kbd|script)(\s|>)/i.test(t[0])&&(this.lexer.state.inRawBlock=!1),{type:"html",raw:t[0],inLink:this.lexer.state.inLink,inRawBlock:this.lexer.state.inRawBlock,block:!1,text:t[0]}}link(e){const t=this.rules.inline.link.exec(e);if(t){const e=t[2].trim();if(!this.options.pedantic&&/^</.test(e)){if(!/>$/.test(e))return;const t=x(e.slice(0,-1),"\\");if((e.length-t.length)%2==0)return}else{const e=function(e,t){if(-1===e.indexOf(t[1]))return-1;let n=0;for(let s=0;s<e.length;s++)if("\\"===e[s])s++;else if(e[s]===t[0])n++;else if(e[s]===t[1]&&(n--,n<0))return s;return-1}(t[2],"()");if(e>-1){const n=(0===t[0].indexOf("!")?5:4)+t[1].length+e;t[2]=t[2].substring(0,e),t[0]=t[0].substring(0,n).trim(),t[3]=""}}let n=t[2],s="";if(this.options.pedantic){const e=/^([^'"]*[^\s])\s+(['"])(.*)\2/.exec(n);e&&(n=e[1],s=e[3])}else s=t[3]?t[3].slice(1,-1):"";return n=n.trim(),/^</.test(n)&&(n=this.options.pedantic&&!/>$/.test(e)?n.slice(1):n.slice(1,-1)),b(t,{href:n?n.replace(this.rules.inline.anyPunctuation,"$1"):n,title:s?s.replace(this.rules.inline.anyPunctuation,"$1"):s},t[0],this.lexer)}}reflink(e,t){let n;if((n=this.rules.inline.reflink.exec(e))||(n=this.rules.inline.nolink.exec(e))){const e=t[(n[2]||n[1]).replace(/\s+/g," ").toLowerCase()];if(!e){const e=n[0].charAt(0);return{type:"text",raw:e,text:e}}return b(n,e,n[0],this.lexer)}}emStrong(e,t,n=""){let s=this.rules.inline.emStrongLDelim.exec(e);if(!s)return;if(s[3]&&n.match(/[\p{L}\p{N}]/u))return;if(!(s[1]||s[2]||"")||!n||this.rules.inline.punctuation.exec(n)){const n=[...s[0]].length-1;let r,i,l=n,o=0;const a="*"===s[0][0]?this.rules.inline.emStrongRDelimAst:this.rules.inline.emStrongRDelimUnd;for(a.lastIndex=0,t=t.slice(-1*e.length+n);null!=(s=a.exec(t));){if(r=s[1]||s[2]||s[3]||s[4]||s[5]||s[6],!r)continue;if(i=[...r].length,s[3]||s[4]){l+=i;continue}if((s[5]||s[6])&&n%3&&!((n+i)%3)){o+=i;continue}if(l-=i,l>0)continue;i=Math.min(i,i+l+o);const t=[...s[0]][0].length,a=e.slice(0,n+s.index+t+i);if(Math.min(n,i)%2){const e=a.slice(1,-1);return{type:"em",raw:a,text:e,tokens:this.lexer.inlineTokens(e)}}const c=a.slice(2,-2);return{type:"strong",raw:a,text:c,tokens:this.lexer.inlineTokens(c)}}}}codespan(e){const t=this.rules.inline.code.exec(e);if(t){let e=t[2].replace(/\n/g," ");const n=/[^ ]/.test(e),s=/^ /.test(e)&&/ $/.test(e);return n&&s&&(e=e.substring(1,e.length-1)),e=c(e,!0),{type:"codespan",raw:t[0],text:e}}}br(e){const t=this.rules.inline.br.exec(e);if(t)return{type:"br",raw:t[0]}}del(e){const t=this.rules.inline.del.exec(e);if(t)return{type:"del",raw:t[0],text:t[2],tokens:this.lexer.inlineTokens(t[2])}}autolink(e){const t=this.rules.inline.autolink.exec(e);if(t){let e,n;return"@"===t[2]?(e=c(t[1]),n="mailto:"+e):(e=c(t[1]),n=e),{type:"link",raw:t[0],text:e,href:n,tokens:[{type:"text",raw:e,text:e}]}}}url(e){let t;if(t=this.rules.inline.url.exec(e)){let e,n;if("@"===t[2])e=c(t[0]),n="mailto:"+e;else{let s;do{s=t[0],t[0]=this.rules.inline._backpedal.exec(t[0])?.[0]??""}while(s!==t[0]);e=c(t[0]),n="www."===t[1]?"http://"+t[0]:t[0]}return{type:"link",raw:t[0],text:e,href:n,tokens:[{type:"text",raw:e,text:e}]}}}inlineText(e){const t=this.rules.inline.text.exec(e);if(t){let e;return e=this.lexer.state.inRawBlock?t[0]:c(t[0]),{type:"text",raw:t[0],text:e}}}}const m=/^ {0,3}((?:-[\t ]*){3,}|(?:_[ \t]*){3,}|(?:\*[ \t]*){3,})(?:\n+|$)/,y=/(?:[*+-]|\d{1,9}[.)])/,$=k(/^(?!bull |blockCode|fences|blockquote|heading|html)((?:.|\n(?!\s*?\n|bull |blockCode|fences|blockquote|heading|html))+?)\n {0,3}(=+|-+) *(?:\n+|$)/).replace(/bull/g,y).replace(/blockCode/g,/ {4}/).replace(/fences/g,/ {0,3}(?:`{3,}|~{3,})/).replace(/blockquote/g,/ {0,3}>/).replace(/heading/g,/ {0,3}#{1,6}/).replace(/html/g,/ {0,3}<[^\n>]+>\n/).getRegex(),z=/^([^\n]+(?:\n(?!hr|heading|lheading|blockquote|fences|list|html|table| +\n)[^\n]+)*)/,T=/(?!\s*\])(?:\\.|[^\[\]\\])+/,R=k(/^ {0,3}\[(label)\]: *(?:\n *)?([^<\s][^\s]*|<.*?>)(?:(?: +(?:\n *)?| *\n *)(title))? *(?:\n+|$)/).replace("label",T).replace("title",/(?:"(?:\\"?|[^"\\])*"|'[^'\n]*(?:\n[^'\n]+)*\n?'|$[^()]*$)/).getRegex(),_=k(/^( {0,3}bull)([ \t][^\n]+?)?(?:\n|$)/).replace(/bull/g,y).getRegex(),A="address|article|aside|base|basefont|blockquote|body|caption|center|col|colgroup|dd|details|dialog|dir|div|dl|dt|fieldset|figcaption|figure|footer|form|frame|frameset|h[1-6]|head|header|hr|html|iframe|legend|li|link|main|menu|menuitem|meta|nav|noframes|ol|optgroup|option|p|param|search|section|summary|table|tbody|td|tfoot|th|thead|title|tr|track|ul",S=/|$))/,I=k("^ {0,3}(?:<(script|pre|style|textarea)[\\s>][\\s\\S]*?(?:</\\1>[^\\n]*\\n+|$)|comment[^\\n]*(\\n+|$)|<\\?[\\s\\S]*?(?:\\?>\\n*|$)|<![A-Z][\\s\\S]*?(?:>\\n*|$)|<!\\[CDATA\\[[\\s\\S]*?(?:\\]\\]>\\n*|$)|</?(tag)(?: +|\\n|/?>)[\\s\\S]*?(?:(?:\\n *)+\\n|$)|<(?!script|pre|style|textarea)([a-z][\\w-]*)(?:attribute)*? */?>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$)|</(?!script|pre|style|textarea)[a-z][\\w-]*\\s*>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$))","i").replace("comment",S).replace("tag",A).replace("attribute",/ +[a-zA-Z:_][\w.:-]*(?: *= *"[^"\n]*"| *= *'[^'\n]*'| *= *[^\s"'=<>`]+)?/).getRegex(),E=k(z).replace("hr",m).replace("heading"," {0,3}#{1,6}(?:\\s|$)").replace("|lheading","").replace("|table","").replace("blockquote"," {0,3}>").replace("fences"," {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list"," {0,3}(?:[*+-]|1[.)]) ").replace("html","</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag",A).getRegex(),q={blockquote:k(/^( {0,3}> ?(paragraph|[^\n]*)(?:\n|$))+/).replace("paragraph",E).getRegex(),code:/^( {4}[^\n]+(?:\n(?: *(?:\n|$))*)?)+/,def:R,fences:/^ {0,3}(`{3,}(?=[^`\n]*(?:\n|$))|~{3,})([^\n]*)(?:\n|$)(?:|([\s\S]*?)(?:\n|$))(?: {0,3}\1[~`]* *(?=\n|$)|$)/,heading:/^ {0,3}(#{1,6})(?=\s|$)(.*)(?:\n+|$)/,hr:m,html:I,lheading:$,list:_,newline:/^(?: *(?:\n|$))+/,paragraph:E,table:f,text:/^[^\n]+/},Z=k("^ *([^\\n ].*)\\n {0,3}((?:\\| *)?:?-+:? *(?:\\| *:?-+:? *)*(?:\\| *)?)(?:\\n((?:(?! *\\n|hr|heading|blockquote|code|fences|list|html).*(?:\\n|$))*)\\n*|$)").replace("hr",m).replace("heading"," {0,3}#{1,6}(?:\\s|$)").replace("blockquote"," {0,3}>").replace("code"," {4}[^\\n]").replace("fences"," {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list"," {0,3}(?:[*+-]|1[.)]) ").replace("html","</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag",A).getRegex(),L={...q,table:Z,paragraph:k(z).replace("hr",m).replace("heading"," {0,3}#{1,6}(?:\\s|$)").replace("|lheading","").replace("table",Z).replace("blockquote"," {0,3}>").replace("fences"," {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list"," {0,3}(?:[*+-]|1[.)]) ").replace("html","</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag",A).getRegex()},P={...q,html:k("^ *(?:comment *(?:\\n|\\s*$)|<(tag)[\\s\\S]+?</\\1> *(?:\\n{2,}|\\s*$)|<tag(?:\"[^\"]*\"|'[^']*'|\\s[^'\"/>\\s]*)*?/?> *(?:\\n{2,}|\\s*$))").replace("comment",S).replace(/tag/g,"(?!(?:a|em|strong|small|s|cite|q|dfn|abbr|data|time|code|var|samp|kbd|sub|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo|span|br|wbr|ins|del|img)\\b)\\w+(?!:|[^\\w\\s@]*@)\\b").getRegex(),def:/^ *\[([^\]]+)\]: *<?([^\s>]+)>?(?: +(["(][^\n]+[")]))? *(?:\n+|$)/,heading:/^(#{1,6})(.*)(?:\n+|$)/,fences:f,lheading:/^(.+?)\n {0,3}(=+|-+) *(?:\n+|$)/,paragraph:k(z).replace("hr",m).replace("heading"," *#{1,6} *[^\n]").replace("lheading",$).replace("|table","").replace("blockquote"," {0,3}>").replace("|fences","").replace("|list","").replace("|html","").replace("|tag","").getRegex()},Q=/^\$[!"#$%&'()*+,\-./:;<=>?@\[\]\\^_`{|}~])/,v=/^( {2,}|\$\n(?!\s*$)/,B="\\p{P}\\p{S}",C=k(/^((?![*_])[\spunctuation])/,"u").replace(/punctuation/g,B).getRegex(),M=k(/^(?:\*+(?:((?!\*)[punct])|[^\s*]))|^_+(?:((?!_)[punct])|([^\s_]))/,"u").replace(/punct/g,B).getRegex(),O=k("^[^_*]*?__[^_*]*?\\*[^_*]*?(?=__)|[^*]+(?=[^*])|(?!\\*)[punct](\\*+)(?=[\\s]|$)|[^punct\\s](\\*+)(?!\\*)(?=[punct\\s]|$)|(?!\\*)[punct\\s](\\*+)(?=[^punct\\s])|[\\s](\\*+)(?!\\*)(?=[punct])|(?!\\*)[punct](\\*+)(?!\\*)(?=[punct])|[^punct\\s](\\*+)(?=[^punct\\s])","gu").replace(/punct/g,B).getRegex(),D=k("^[^_*]*?\\*\\*[^_*]*?_[^_*]*?(?=\\*\\*)|[^_]+(?=[^_])|(?!_)[punct](_+)(?=[\\s]|$)|[^punct\\s](_+)(?!_)(?=[punct\\s]|$)|(?!_)[punct\\s](_+)(?=[^punct\\s])|[\\s](_+)(?!_)(?=[punct])|(?!_)[punct](_+)(?!_)(?=[punct])","gu").replace(/punct/g,B).getRegex(),j=k(/\$[punct])/,"gu").replace(/punct/g,B).getRegex(),H=k(/^<(scheme:[^\s\x00-\x1f<>]*|email)>/).replace("scheme",/[a-zA-Z][a-zA-Z0-9+.-]{1,31}/).replace("email",/[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+(@)[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+(?![-_])/).getRegex(),U=k(S).replace("(?:--\x3e|$)","--\x3e").getRegex(),X=k("^comment|^</[a-zA-Z][\\w:-]*\\s*>|^<[a-zA-Z][\\w-]*(?:attribute)*?\\s*/?>|^<\\?[\\s\\S]*?\\?>|^<![a-zA-Z]+\\s[\\s\\S]*?>|^<!\\[CDATA\\[[\\s\\S]*?\\]\\]>").replace("comment",U).replace("attribute",/\s+[a-zA-Z:_][\w.:-]*(?:\s*=\s*"[^"]*"|\s*=\s*'[^']*'|\s*=\s*[^\s"'=<>`]+)?/).getRegex(),F=/(?:\[(?:\\.|[^\[\]\\])*\]|\\.|`[^`]*`|[^\[\]\\`])*?/,N=k(/^!?\[(label)\]\(\s*(href)(?:\s+(title))?\s*$/).replace("label",F).replace("href",/<(?:\\.|[^\n<>\\])+>|[^\s\x00-\x1f]*/).replace("title",/"(?:\\"?|[^"\\])*"|'(?:\\'?|[^'\\])*'|$(?:\\$?|[^)\\])*\)/).getRegex(),G=k(/^!?\[(label)\]\[(ref)\]/).replace("label",F).replace("ref",T).getRegex(),J=k(/^!?\[(ref)\](?:\[\])?/).replace("ref",T).getRegex(),K={_backpedal:f,anyPunctuation:j,autolink:H,blockSkip:/\[[^[\]]*?\]$[^\($]*?\)|`[^`]*?`|<[^<>]*?>/g,br:v,code:/^(`+)([^`]|[^`][\s\S]*?[^`])\1(?!`)/,del:f,emStrongLDelim:M,emStrongRDelimAst:O,emStrongRDelimUnd:D,escape:Q,link:N,nolink:J,punctuation:C,reflink:G,reflinkSearch:k("reflink|nolink(?!\$)","g").replace("reflink",G).replace("nolink",J).getRegex(),tag:X,text:/^(`+|[^`])(?:(?= {2,}\n)|[\s\S]*?(?:(?=[\\<!\[`*_]|\b_|$)|[^ ](?= {2,}\n)))/,url:f},V={...K,link:k(/^!?\[(label)\]\((.*?)$/).replace("label",F).getRegex(),reflink:k(/^!?\[(label)\]\s*\[([^\]]*)\]/).replace("label",F).getRegex()},W={...K,escape:k(Q).replace("])","~|])").getRegex(),url:k(/^((?:ftp|https?):\/\/|www\.)(?:[a-zA-Z0-9\-]+\.?)+[^\s<]*|^email/,"i").replace("email",/[A-Za-z0-9._+-]+(@)[a-zA-Z0-9-_]+(?:\.[a-zA-Z0-9-_]*[a-zA-Z0-9])+(?![-_])/).getRegex(),_backpedal:/(?:[^?!.,:;*_'"~()&]+|$[^)]*$|&(?![a-zA-Z0-9]+;$)|[?!.,:;*_'"~)]+(?!$))+/,del:/^(~~?)(?=[^\s~])([\s\S]*?[^\s~])\1(?=[^~]|$)/,text:/^([`~]+|[^`~])(?:(?= {2,}\n)|(?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)|[\s\S]*?(?:(?=[\\<!\[`*~_]|\b_|https?:\/\/|ftp:\/\/|www\.|$)|[^ ](?= {2,}\n)|[^a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-](?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)))/},Y={...W,br:k(v).replace("{2,}","*").getRegex(),text:k(W.text).replace("\\b_","\\b_| {2,}\\n").replace(/\{2,\}/g,"*").getRegex()},ee={normal:q,gfm:L,pedantic:P},te={normal:K,gfm:W,breaks:Y,pedantic:V};class ne{tokens;options;state;tokenizer;inlineQueue;constructor(t){this.tokens=[],this.tokens.links=Object.create(null),this.options=t||e.defaults,this.options.tokenizer=this.options.tokenizer||new w,this.tokenizer=this.options.tokenizer,this.tokenizer.options=this.options,this.tokenizer.lexer=this,this.inlineQueue=[],this.state={inLink:!1,inRawBlock:!1,top:!0};const n={block:ee.normal,inline:te.normal};this.options.pedantic?(n.block=ee.pedantic,n.inline=te.pedantic):this.options.gfm&&(n.block=ee.gfm,this.options.breaks?n.inline=te.breaks:n.inline=te.gfm),this.tokenizer.rules=n}static get rules(){return{block:ee,inline:te}}static lex(e,t){return new ne(t).lex(e)}static lexInline(e,t){return new ne(t).inlineTokens(e)}lex(e){e=e.replace(/\r\n|\r/g,"\n"),this.blockTokens(e,this.tokens);for(let e=0;e<this.inlineQueue.length;e++){const t=this.inlineQueue[e];this.inlineTokens(t.src,t.tokens)}return this.inlineQueue=[],this.tokens}blockTokens(e,t=[]){let n,s,r,i;for(e=this.options.pedantic?e.replace(/\t/g," ").replace(/^ +$/gm,""):e.replace(/^( *)(\t+)/gm,((e,t,n)=>t+" ".repeat(n.length)));e;)if(!(this.options.extensions&&this.options.extensions.block&&this.options.extensions.block.some((s=>!!(n=s.call({lexer:this},e,t))&&(e=e.substring(n.raw.length),t.push(n),!0)))))if(n=this.tokenizer.space(e))e=e.substring(n.raw.length),1===n.raw.length&&t.length>0?t[t.length-1].raw+="\n":t.push(n);else if(n=this.tokenizer.code(e))e=e.substring(n.raw.length),s=t[t.length-1],!s||"paragraph"!==s.type&&"text"!==s.type?t.push(n):(s.raw+="\n"+n.raw,s.text+="\n"+n.text,this.inlineQueue[this.inlineQueue.length-1].src=s.text);else if(n=this.tokenizer.fences(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.heading(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.hr(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.blockquote(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.list(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.html(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.def(e))e=e.substring(n.raw.length),s=t[t.length-1],!s||"paragraph"!==s.type&&"text"!==s.type?this.tokens.links[n.tag]||(this.tokens.links[n.tag]={href:n.href,title:n.title}):(s.raw+="\n"+n.raw,s.text+="\n"+n.raw,this.inlineQueue[this.inlineQueue.length-1].src=s.text);else if(n=this.tokenizer.table(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.lheading(e))e=e.substring(n.raw.length),t.push(n);else{if(r=e,this.options.extensions&&this.options.extensions.startBlock){let t=1/0;const n=e.slice(1);let s;this.options.extensions.startBlock.forEach((e=>{s=e.call({lexer:this},n),"number"==typeof s&&s>=0&&(t=Math.min(t,s))})),t<1/0&&t>=0&&(r=e.substring(0,t+1))}if(this.state.top&&(n=this.tokenizer.paragraph(r)))s=t[t.length-1],i&&"paragraph"===s.type?(s.raw+="\n"+n.raw,s.text+="\n"+n.text,this.inlineQueue.pop(),this.inlineQueue[this.inlineQueue.length-1].src=s.text):t.push(n),i=r.length!==e.length,e=e.substring(n.raw.length);else if(n=this.tokenizer.text(e))e=e.substring(n.raw.length),s=t[t.length-1],s&&"text"===s.type?(s.raw+="\n"+n.raw,s.text+="\n"+n.text,this.inlineQueue.pop(),this.inlineQueue[this.inlineQueue.length-1].src=s.text):t.push(n);else if(e){const t="Infinite loop on byte: "+e.charCodeAt(0);if(this.options.silent){console.error(t);break}throw new Error(t)}}return this.state.top=!0,t}inline(e,t=[]){return this.inlineQueue.push({src:e,tokens:t}),t}inlineTokens(e,t=[]){let n,s,r,i,l,o,a=e;if(this.tokens.links){const e=Object.keys(this.tokens.links);if(e.length>0)for(;null!=(i=this.tokenizer.rules.inline.reflinkSearch.exec(a));)e.includes(i[0].slice(i[0].lastIndexOf("[")+1,-1))&&(a=a.slice(0,i.index)+"["+"a".repeat(i[0].length-2)+"]"+a.slice(this.tokenizer.rules.inline.reflinkSearch.lastIndex))}for(;null!=(i=this.tokenizer.rules.inline.blockSkip.exec(a));)a=a.slice(0,i.index)+"["+"a".repeat(i[0].length-2)+"]"+a.slice(this.tokenizer.rules.inline.blockSkip.lastIndex);for(;null!=(i=this.tokenizer.rules.inline.anyPunctuation.exec(a));)a=a.slice(0,i.index)+"++"+a.slice(this.tokenizer.rules.inline.anyPunctuation.lastIndex);for(;e;)if(l||(o=""),l=!1,!(this.options.extensions&&this.options.extensions.inline&&this.options.extensions.inline.some((s=>!!(n=s.call({lexer:this},e,t))&&(e=e.substring(n.raw.length),t.push(n),!0)))))if(n=this.tokenizer.escape(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.tag(e))e=e.substring(n.raw.length),s=t[t.length-1],s&&"text"===n.type&&"text"===s.type?(s.raw+=n.raw,s.text+=n.text):t.push(n);else if(n=this.tokenizer.link(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.reflink(e,this.tokens.links))e=e.substring(n.raw.length),s=t[t.length-1],s&&"text"===n.type&&"text"===s.type?(s.raw+=n.raw,s.text+=n.text):t.push(n);else if(n=this.tokenizer.emStrong(e,a,o))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.codespan(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.br(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.del(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.autolink(e))e=e.substring(n.raw.length),t.push(n);else if(this.state.inLink||!(n=this.tokenizer.url(e))){if(r=e,this.options.extensions&&this.options.extensions.startInline){let t=1/0;const n=e.slice(1);let s;this.options.extensions.startInline.forEach((e=>{s=e.call({lexer:this},n),"number"==typeof s&&s>=0&&(t=Math.min(t,s))})),t<1/0&&t>=0&&(r=e.substring(0,t+1))}if(n=this.tokenizer.inlineText(r))e=e.substring(n.raw.length),"_"!==n.raw.slice(-1)&&(o=n.raw.slice(-1)),l=!0,s=t[t.length-1],s&&"text"===s.type?(s.raw+=n.raw,s.text+=n.text):t.push(n);else if(e){const t="Infinite loop on byte: "+e.charCodeAt(0);if(this.options.silent){console.error(t);break}throw new Error(t)}}else e=e.substring(n.raw.length),t.push(n);return t}}class se{options;constructor(t){this.options=t||e.defaults}code(e,t,n){const s=(t||"").match(/^\S*/)?.[0];return e=e.replace(/\n$/,"")+"\n",s?'<pre><code class="language-'+c(s)+'">'+(n?e:c(e,!0))+"</code></pre>\n":"<pre><code>"+(n?e:c(e,!0))+"</code></pre>\n"}blockquote(e){return`<blockquote>\n${e}</blockquote>\n`}html(e,t){return e}heading(e,t,n){return`<h${t}>${e}</h${t}>\n`}hr(){return"<hr>\n"}list(e,t,n){const s=t?"ol":"ul";return"<"+s+(t&&1!==n?' start="'+n+'"':"")+">\n"+e+"</"+s+">\n"}listitem(e,t,n){return`<li>${e}</li>\n`}checkbox(e){return"<input "+(e?'checked="" ':"")+'disabled="" type="checkbox">'}paragraph(e){return`<p>${e}</p>\n`}table(e,t){return t&&(t=`<tbody>${t}</tbody>`),"<table>\n<thead>\n"+e+"</thead>\n"+t+"</table>\n"}tablerow(e){return`<tr>\n${e}</tr>\n`}tablecell(e,t){const n=t.header?"th":"td";return(t.align?`<${n} align="${t.align}">`:`<${n}>`)+e+`</${n}>\n`}strong(e){return`<strong>${e}</strong>`}em(e){return`<em>${e}</em>`}codespan(e){return`<code>${e}</code>`}br(){return"<br>"}del(e){return`<del>${e}</del>`}link(e,t,n){const s=g(e);if(null===s)return n;let r='<a href="'+(e=s)+'"';return t&&(r+=' title="'+t+'"'),r+=">"+n+"</a>",r}image(e,t,n){const s=g(e);if(null===s)return n;let r=`<img src="${e=s}" alt="${n}"`;return t&&(r+=` title="${t}"`),r+=">",r}text(e){return e}}class re{strong(e){return e}em(e){return e}codespan(e){return e}del(e){return e}html(e){return e}text(e){return e}link(e,t,n){return""+n}image(e,t,n){return""+n}br(){return""}}class ie{options;renderer;textRenderer;constructor(t){this.options=t||e.defaults,this.options.renderer=this.options.renderer||new se,this.renderer=this.options.renderer,this.renderer.options=this.options,this.textRenderer=new re}static parse(e,t){return new ie(t).parse(e)}static parseInline(e,t){return new ie(t).parseInline(e)}parse(e,t=!0){let n="";for(let s=0;s<e.length;s++){const r=e[s];if(this.options.extensions&&this.options.extensions.renderers&&this.options.extensions.renderers[r.type]){const e=r,t=this.options.extensions.renderers[e.type].call({parser:this},e);if(!1!==t||!["space","hr","heading","code","table","blockquote","list","html","paragraph","text"].includes(e.type)){n+=t||"";continue}}switch(r.type){case"space":continue;case"hr":n+=this.renderer.hr();continue;case"heading":{const e=r;n+=this.renderer.heading(this.parseInline(e.tokens),e.depth,p(this.parseInline(e.tokens,this.textRenderer)));continue}case"code":{const e=r;n+=this.renderer.code(e.text,e.lang,!!e.escaped);continue}case"table":{const e=r;let t="",s="";for(let t=0;t<e.header.length;t++)s+=this.renderer.tablecell(this.parseInline(e.header[t].tokens),{header:!0,align:e.align[t]});t+=this.renderer.tablerow(s);let i="";for(let t=0;t<e.rows.length;t++){const n=e.rows[t];s="";for(let t=0;t<n.length;t++)s+=this.renderer.tablecell(this.parseInline(n[t].tokens),{header:!1,align:e.align[t]});i+=this.renderer.tablerow(s)}n+=this.renderer.table(t,i);continue}case"blockquote":{const e=r,t=this.parse(e.tokens);n+=this.renderer.blockquote(t);continue}case"list":{const e=r,t=e.ordered,s=e.start,i=e.loose;let l="";for(let t=0;t<e.items.length;t++){const n=e.items[t],s=n.checked,r=n.task;let o="";if(n.task){const e=this.renderer.checkbox(!!s);i?n.tokens.length>0&&"paragraph"===n.tokens[0].type?(n.tokens[0].text=e+" "+n.tokens[0].text,n.tokens[0].tokens&&n.tokens[0].tokens.length>0&&"text"===n.tokens[0].tokens[0].type&&(n.tokens[0].tokens[0].text=e+" "+n.tokens[0].tokens[0].text)):n.tokens.unshift({type:"text",text:e+" "}):o+=e+" "}o+=this.parse(n.tokens,i),l+=this.renderer.listitem(o,r,!!s)}n+=this.renderer.list(l,t,s);continue}case"html":{const e=r;n+=this.renderer.html(e.text,e.block);continue}case"paragraph":{const e=r;n+=this.renderer.paragraph(this.parseInline(e.tokens));continue}case"text":{let i=r,l=i.tokens?this.parseInline(i.tokens):i.text;for(;s+1<e.length&&"text"===e[s+1].type;)i=e[++s],l+="\n"+(i.tokens?this.parseInline(i.tokens):i.text);n+=t?this.renderer.paragraph(l):l;continue}default:{const e='Token with "'+r.type+'" type was not found.';if(this.options.silent)return console.error(e),"";throw new Error(e)}}}return n}parseInline(e,t){t=t||this.renderer;let n="";for(let s=0;s<e.length;s++){const r=e[s];if(this.options.extensions&&this.options.extensions.renderers&&this.options.extensions.renderers[r.type]){const e=this.options.extensions.renderers[r.type].call({parser:this},r);if(!1!==e||!["escape","html","link","image","strong","em","codespan","br","del","text"].includes(r.type)){n+=e||"";continue}}switch(r.type){case"escape":{const e=r;n+=t.text(e.text);break}case"html":{const e=r;n+=t.html(e.text);break}case"link":{const e=r;n+=t.link(e.href,e.title,this.parseInline(e.tokens,t));break}case"image":{const e=r;n+=t.image(e.href,e.title,e.text);break}case"strong":{const e=r;n+=t.strong(this.parseInline(e.tokens,t));break}case"em":{const e=r;n+=t.em(this.parseInline(e.tokens,t));break}case"codespan":{const e=r;n+=t.codespan(e.text);break}case"br":n+=t.br();break;case"del":{const e=r;n+=t.del(this.parseInline(e.tokens,t));break}case"text":{const e=r;n+=t.text(e.text);break}default:{const e='Token with "'+r.type+'" type was not found.';if(this.options.silent)return console.error(e),"";throw new Error(e)}}}return n}}class le{options;constructor(t){this.options=t||e.defaults}static passThroughHooks=new Set(["preprocess","postprocess","processAllTokens"]);preprocess(e){return e}postprocess(e){return e}processAllTokens(e){return e}}class oe{defaults={async:!1,breaks:!1,extensions:null,gfm:!0,hooks:null,pedantic:!1,renderer:null,silent:!1,tokenizer:null,walkTokens:null};options=this.setOptions;parse=this.#e(ne.lex,ie.parse);parseInline=this.#e(ne.lexInline,ie.parseInline);Parser=ie;Renderer=se;TextRenderer=re;Lexer=ne;Tokenizer=w;Hooks=le;constructor(...e){this.use(...e)}walkTokens(e,t){let n=[];for(const s of e)switch(n=n.concat(t.call(this,s)),s.type){case"table":{const e=s;for(const s of e.header)n=n.concat(this.walkTokens(s.tokens,t));for(const s of e.rows)for(const e of s)n=n.concat(this.walkTokens(e.tokens,t));break}case"list":{const e=s;n=n.concat(this.walkTokens(e.items,t));break}default:{const e=s;this.defaults.extensions?.childTokens?.[e.type]?this.defaults.extensions.childTokens[e.type].forEach((s=>{const r=e[s].flat(1/0);n=n.concat(this.walkTokens(r,t))})):e.tokens&&(n=n.concat(this.walkTokens(e.tokens,t)))}}return n}use(...e){const t=this.defaults.extensions||{renderers:{},childTokens:{}};return e.forEach((e=>{const n={...e};if(n.async=this.defaults.async||n.async||!1,e.extensions&&(e.extensions.forEach((e=>{if(!e.name)throw new Error("extension name required");if("renderer"in e){const n=t.renderers[e.name];t.renderers[e.name]=n?function(...t){let s=e.renderer.apply(this,t);return!1===s&&(s=n.apply(this,t)),s}:e.renderer}if("tokenizer"in e){if(!e.level||"block"!==e.level&&"inline"!==e.level)throw new Error("extension level must be 'block' or 'inline'");const n=t[e.level];n?n.unshift(e.tokenizer):t[e.level]=[e.tokenizer],e.start&&("block"===e.level?t.startBlock?t.startBlock.push(e.start):t.startBlock=[e.start]:"inline"===e.level&&(t.startInline?t.startInline.push(e.start):t.startInline=[e.start]))}"childTokens"in e&&e.childTokens&&(t.childTokens[e.name]=e.childTokens)})),n.extensions=t),e.renderer){const t=this.defaults.renderer||new se(this.defaults);for(const n in e.renderer){if(!(n in t))throw new Error(`renderer '${n}' does not exist`);if("options"===n)continue;const s=n,r=e.renderer[s],i=t[s];t[s]=(...e)=>{let n=r.apply(t,e);return!1===n&&(n=i.apply(t,e)),n||""}}n.renderer=t}if(e.tokenizer){const t=this.defaults.tokenizer||new w(this.defaults);for(const n in e.tokenizer){if(!(n in t))throw new Error(`tokenizer '${n}' does not exist`);if(["options","rules","lexer"].includes(n))continue;const s=n,r=e.tokenizer[s],i=t[s];t[s]=(...e)=>{let n=r.apply(t,e);return!1===n&&(n=i.apply(t,e)),n}}n.tokenizer=t}if(e.hooks){const t=this.defaults.hooks||new le;for(const n in e.hooks){if(!(n in t))throw new Error(`hook '${n}' does not exist`);if("options"===n)continue;const s=n,r=e.hooks[s],i=t[s];le.passThroughHooks.has(n)?t[s]=e=>{if(this.defaults.async)return Promise.resolve(r.call(t,e)).then((e=>i.call(t,e)));const n=r.call(t,e);return i.call(t,n)}:t[s]=(...e)=>{let n=r.apply(t,e);return!1===n&&(n=i.apply(t,e)),n}}n.hooks=t}if(e.walkTokens){const t=this.defaults.walkTokens,s=e.walkTokens;n.walkTokens=function(e){let n=[];return n.push(s.call(this,e)),t&&(n=n.concat(t.call(this,e))),n}}this.defaults={...this.defaults,...n}})),this}setOptions(e){return this.defaults={...this.defaults,...e},this}lexer(e,t){return ne.lex(e,t??this.defaults)}parser(e,t){return ie.parse(e,t??this.defaults)}#e(e,t){return(n,s)=>{const r={...s},i={...this.defaults,...r};!0===this.defaults.async&&!1===r.async&&(i.silent||console.warn("marked(): The async option was set to true by an extension. The async: false option sent to parse will be ignored."),i.async=!0);const l=this.#t(!!i.silent,!!i.async);if(null==n)return l(new Error("marked(): input parameter is undefined or null"));if("string"!=typeof n)return l(new Error("marked(): input parameter is of type "+Object.prototype.toString.call(n)+", string expected"));if(i.hooks&&(i.hooks.options=i),i.async)return Promise.resolve(i.hooks?i.hooks.preprocess(n):n).then((t=>e(t,i))).then((e=>i.hooks?i.hooks.processAllTokens(e):e)).then((e=>i.walkTokens?Promise.all(this.walkTokens(e,i.walkTokens)).then((()=>e)):e)).then((e=>t(e,i))).then((e=>i.hooks?i.hooks.postprocess(e):e)).catch(l);try{i.hooks&&(n=i.hooks.preprocess(n));let s=e(n,i);i.hooks&&(s=i.hooks.processAllTokens(s)),i.walkTokens&&this.walkTokens(s,i.walkTokens);let r=t(s,i);return i.hooks&&(r=i.hooks.postprocess(r)),r}catch(e){return l(e)}}}#t(e,t){return n=>{if(n.message+="\nPlease report this to https://github.com/markedjs/marked.",e){const e="<p>An error occurred:</p><pre>"+c(n.message+"",!0)+"</pre>";return t?Promise.resolve(e):e}if(t)return Promise.reject(n);throw n}}}const ae=new oe;function ce(e,t){return ae.parse(e,t)}ce.options=ce.setOptions=function(e){return ae.setOptions(e),ce.defaults=ae.defaults,n(ce.defaults),ce},ce.getDefaults=t,ce.defaults=e.defaults,ce.use=function(...e){return ae.use(...e),ce.defaults=ae.defaults,n(ce.defaults),ce},ce.walkTokens=function(e,t){return ae.walkTokens(e,t)},ce.parseInline=ae.parseInline,ce.Parser=ie,ce.parser=ie.parse,ce.Renderer=se,ce.TextRenderer=re,ce.Lexer=ne,ce.lexer=ne.lex,ce.Tokenizer=w,ce.Hooks=le,ce.parse=ce;const he=ce.options,pe=ce.setOptions,ue=ce.use,ke=ce.walkTokens,ge=ce.parseInline,fe=ce,de=ie.parse,xe=ne.lex;e.Hooks=le,e.Lexer=ne,e.Marked=oe,e.Parser=ie,e.Renderer=se,e.TextRenderer=re,e.Tokenizer=w,e.getDefaults=t,e.lexer=xe,e.marked=ce,e.options=he,e.parse=fe,e.parseInline=ge,e.parser=de,e.setOptions=pe,e.use=ue,e.walkTokens=ke}));
</script>
<script>
const PRESETS = {"claude": "# CLAUDE.md\n\nBehavioral guidelines to reduce common LLM coding mistakes. Merge with project-specific instructions as needed.\n\n**Tradeoff:** These guidelines bias toward caution over speed. For trivial tasks, use judgment.\n\n## 1. Think Before Coding\n\n**Don't assume. Don't hide confusion. Surface tradeoffs.**\n\nBefore implementing:\n- State your assumptions explicitly. If uncertain, ask.\n- If multiple interpretations exist, present them - don't pick silently.\n- If a simpler approach exists, say so. Push back when warranted.\n- If something is unclear, stop. Name what's confusing. Ask.\n\n## 2. Simplicity First\n\n**Minimum code that solves the problem. Nothing speculative.**\n\n- No features beyond what was asked.\n- No abstractions for single-use code.\n- No \"flexibility\" or \"configurability\" that wasn't requested.\n- No error handling for impossible scenarios.\n- If you write 200 lines and it could be 50, rewrite it.\n\nAsk yourself: \"Would a senior engineer say this is overcomplicated?\" If yes, simplify.\n\n## 3. Surgical Changes\n\n**Touch only what you must. Clean up only your own mess.**\n\nWhen editing existing code:\n- Don't \"improve\" adjacent code, comments, or formatting.\n- Don't refactor things that aren't broken.\n- Match existing style, even if you'd do it differently.\n- If you notice unrelated dead code, mention it - don't delete it.\n\nWhen your changes create orphans:\n- Remove imports/variables/functions that YOUR changes made unused.\n- Don't remove pre-existing dead code unless asked.\n\nThe test: Every changed line should trace directly to the user's request.\n\n## 4. Goal-Driven Execution\n\n**Define success criteria. Loop until verified.**\n\nTransform tasks into verifiable goals:\n- \"Add validation\" → \"Write tests for invalid inputs, then make them pass\"\n- \"Fix the bug\" → \"Write a test that reproduces it, then make it pass\"\n- \"Refactor X\" → \"Ensure tests pass before and after\"\n\nFor multi-step tasks, state a brief plan:\n```\n1. [Step] → verify: [check]\n2. [Step] → verify: [check]\n3. [Step] → verify: [check]\n```\n\nStrong success criteria let you loop independently. Weak criteria (\"make it work\") require constant clarification.\n\n---\n\n**These guidelines are working if:** fewer unnecessary changes in diffs, fewer rewrites due to overcomplication, and clarifying questions come before implementation rather than after mistakes.\n", "example": "# 서원지기: 조선 서원 배향 인물 지식그래프\n\n## 1. 프로젝트 소개\n우리 팀은 **조선시대 서원 기록**을 바탕으로 서원과 배향 인물, 학맥의 관계를 지식그래프로 구축합니다.\n\n## 2. 팀원\n- 김가람 (사학과) — 데이터 수집\n- 이나래 (국어국문학과) — 그래프 설계\n- 박다온 (철학과) — 시각화·해석\n\n## 3. 데이터 출처\n- [한국학자료센터](https://kostma.aks.ac.kr)\n\n## 4. 그래프 설계\n| 노드 | 주요 속성 |\n|---|---|\n| Person | name, birth, death |\n| Seowon | name, region |\n\n## 5. 진행 상황\n- [x] 데이터셋 선정\n- [ ] 노드·관계 설계\n- [ ] 중간발표 준비", "blank": "# (팀 이름): (프로젝트 제목)\n\n## 1. 프로젝트 소개\n우리 팀은 **(데이터셋 이름)** 자료를 바탕으로 (무엇과 무엇의 관계)를 지식그래프로 구축합니다.\n\n## 2. 팀원\n- (이름) (학과) — (역할)\n- (이름) (학과) — (역할)\n- (이름) (학과) — (역할)\n\n## 3. 데이터 출처\n- [(출처 이름)]((출처 주소))\n\n## 4. 그래프 설계\n| 노드 | 주요 속성 |\n|---|---|\n| (노드 이름) | (속성1), (속성2) |\n\n## 5. 진행 상황\n- [ ] 데이터셋 선정\n- [ ] 노드·관계 설계\n- [ ] 중간발표 준비"};
const src = document.getElementById('src'), out = document.getElementById('out');
marked.setOptions({gfm:true, breaks:false});
function render(){ out.innerHTML = marked.parse(src.value); try{localStorage.setItem('md-draft', src.value);}catch(e){} }
src.addEventListener('input', render);
document.querySelectorAll('[data-preset]').forEach(b => b.onclick = () => {
if (src.value.trim() && !confirm('지금 작성한 내용이 지워집니다. 계속할까요?')) return;
src.value = PRESETS[b.dataset.preset]; render();
});
document.getElementById('clear').onclick = () => { if (confirm('내용을 모두 지울까요?')) { src.value = ''; render(); } };
document.getElementById('save').onclick = () => {
const a = document.createElement('a');
a.href = URL.createObjectURL(new Blob([src.value], {type:'text/markdown'}));
a.download = 'README.md'; a.click(); URL.revokeObjectURL(a.href);
};
let draft = null; try{ draft = localStorage.getItem('md-draft'); }catch(e){}
src.value = draft || PRESETS.claude; render();
</script>
</body>
</html>

마크다운연습

2026-10-23T16:20:41Z

Kimseoyun:

<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>마크다운 실시간 연습장</title>
<style>
:root{--blue:#1d4ed8;--line:#cbd5e1;--bg:#f8fafc;--ink:#1f2937;--muted:#64748b}
*{box-sizing:border-box}
body{margin:0;font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:var(--ink);background:#fff}
header{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
header h1{font-size:18px;margin:0 12px 0 0}
button{font:inherit;font-size:13px;padding:6px 12px;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:pointer}
button:hover{border-color:var(--blue);color:var(--blue)}
button.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.wrap{display:grid;grid-template-columns:1fr 1fr;height:calc(100vh - 62px)}
.pane{display:flex;flex-direction:column;min-height:0}
.pane+.pane{border-left:1px solid var(--line)}
.label{font-size:12px;font-weight:700;padding:8px 16px;border-bottom:1px solid var(--line);background:var(--bg);color:var(--muted)}
.pane:last-child .label{color:var(--blue)}
textarea{flex:1;border:0;resize:none;padding:16px;font:14px/1.6 "D2Coding",Consolas,monospace;background:#fafafa;outline:none}
#out{flex:1;overflow:auto;padding:16px 24px;line-height:1.6}
#out h1,#out h2{border-bottom:1px solid #d0d7de;padding-bottom:4px}
#out h1{font-size:1.6em}#out h2{font-size:1.3em}
#out code{background:#eff1f3;padding:1px 5px;border-radius:4px;font-size:90%}
#out pre{background:#f6f8fa;padding:12px;border-radius:6px;overflow:auto}
#out pre code{background:none;padding:0}
#out table{border-collapse:collapse}
#out th,#out td{border:1px solid #d0d7de;padding:4px 10px}
#out th{background:#f6f8fa}
#out blockquote{margin:0;padding:0 14px;border-left:4px solid #d0d7de;color:#57606a}
#out a{color:var(--blue)}
#out li:has(>input[type=checkbox]){list-style:none;margin-left:-1.2em}
#out hr{border:0;border-top:2px solid #d0d7de}
@media (max-width:720px){.wrap{grid-template-columns:1fr;height:auto}.pane+.pane{border-left:0;border-top:1px solid var(--line)}textarea{min-height:45vh}#out{min-height:45vh}}
</style>
</head>
<body>
<header>
<h1>📝 마크다운 실시간 연습장</h1>
<button data-preset="claude">CLAUDE.md 예시</button>
<button data-preset="example">README 예시</button>
<button data-preset="blank">README 빈 틀</button>
<button id="clear">비우기</button>
<button id="save" class="primary">README.md로 저장</button>
</header>
<div class="wrap">
<div class="pane"><div class="label">✏️ 입력 (.md 원문) — 여기에 작성하세요</div><textarea id="src" spellcheck="false"></textarea></div>
<div class="pane"><div class="label">👀 결과 (렌더링 화면) — 입력하는 즉시 바뀝니다</div><div id="out"></div></div>
</div>
<script>/**
* marked v12.0.2 - a markdown parser
* Copyright (c) 2011-2024, Christopher Jeffrey. (MIT Licensed)
* https://github.com/markedjs/marked
*/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).marked={})}(this,(function(e){"use strict";function t(){return{async:!1,breaks:!1,extensions:null,gfm:!0,hooks:null,pedantic:!1,renderer:null,silent:!1,tokenizer:null,walkTokens:null}}function n(t){e.defaults=t}e.defaults={async:!1,breaks:!1,extensions:null,gfm:!0,hooks:null,pedantic:!1,renderer:null,silent:!1,tokenizer:null,walkTokens:null};const s=/[&<>"']/,r=new RegExp(s.source,"g"),i=/[<>"']|&(?!(#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/,l=new RegExp(i.source,"g"),o={"&":"&","<":"<",">":">",'"':""","'":"'"},a=e=>o[e];function c(e,t){if(t){if(s.test(e))return e.replace(r,a)}else if(i.test(e))return e.replace(l,a);return e}const h=/&(#(?:\d+)|(?:#x[0-9A-Fa-f]+)|(?:\w+));?/gi;function p(e){return e.replace(h,((e,t)=>"colon"===(t=t.toLowerCase())?":":"#"===t.charAt(0)?"x"===t.charAt(1)?String.fromCharCode(parseInt(t.substring(2),16)):String.fromCharCode(+t.substring(1)):""))}const u=/(^|[^\[])\^/g;function k(e,t){let n="string"==typeof e?e:e.source;t=t||"";const s={replace:(e,t)=>{let r="string"==typeof t?t:t.source;return r=r.replace(u,"$1"),n=n.replace(e,r),s},getRegex:()=>new RegExp(n,t)};return s}function g(e){try{e=encodeURI(e).replace(/%25/g,"%")}catch(e){return null}return e}const f={exec:()=>null};function d(e,t){const n=e.replace(/\|/g,((e,t,n)=>{let s=!1,r=t;for(;--r>=0&&"\\"===n[r];)s=!s;return s?"|":" |"})).split(/ \|/);let s=0;if(n[0].trim()||n.shift(),n.length>0&&!n[n.length-1].trim()&&n.pop(),t)if(n.length>t)n.splice(t);else for(;n.length<t;)n.push("");for(;s<n.length;s++)n[s]=n[s].trim().replace(/\\\|/g,"|");return n}function x(e,t,n){const s=e.length;if(0===s)return"";let r=0;for(;r<s;){const i=e.charAt(s-r-1);if(i!==t||n){if(i===t||!n)break;r++}else r++}return e.slice(0,s-r)}function b(e,t,n,s){const r=t.href,i=t.title?c(t.title):null,l=e[1].replace(/\\([\[\]])/g,"$1");if("!"!==e[0].charAt(0)){s.state.inLink=!0;const e={type:"link",raw:n,href:r,title:i,text:l,tokens:s.inlineTokens(l)};return s.state.inLink=!1,e}return{type:"image",raw:n,href:r,title:i,text:c(l)}}class w{options;rules;lexer;constructor(t){this.options=t||e.defaults}space(e){const t=this.rules.block.newline.exec(e);if(t&&t[0].length>0)return{type:"space",raw:t[0]}}code(e){const t=this.rules.block.code.exec(e);if(t){const e=t[0].replace(/^ {1,4}/gm,"");return{type:"code",raw:t[0],codeBlockStyle:"indented",text:this.options.pedantic?e:x(e,"\n")}}}fences(e){const t=this.rules.block.fences.exec(e);if(t){const e=t[0],n=function(e,t){const n=e.match(/^(\s+)(?:```)/);if(null===n)return t;const s=n[1];return t.split("\n").map((e=>{const t=e.match(/^\s+/);if(null===t)return e;const[n]=t;return n.length>=s.length?e.slice(s.length):e})).join("\n")}(e,t[3]||"");return{type:"code",raw:e,lang:t[2]?t[2].trim().replace(this.rules.inline.anyPunctuation,"$1"):t[2],text:n}}}heading(e){const t=this.rules.block.heading.exec(e);if(t){let e=t[2].trim();if(/#$/.test(e)){const t=x(e,"#");this.options.pedantic?e=t.trim():t&&!/ $/.test(t)||(e=t.trim())}return{type:"heading",raw:t[0],depth:t[1].length,text:e,tokens:this.lexer.inline(e)}}}hr(e){const t=this.rules.block.hr.exec(e);if(t)return{type:"hr",raw:t[0]}}blockquote(e){const t=this.rules.block.blockquote.exec(e);if(t){let e=t[0].replace(/\n {0,3}((?:=+|-+) *)(?=\n|$)/g,"\n $1");e=x(e.replace(/^ *>[ \t]?/gm,""),"\n");const n=this.lexer.state.top;this.lexer.state.top=!0;const s=this.lexer.blockTokens(e);return this.lexer.state.top=n,{type:"blockquote",raw:t[0],tokens:s,text:e}}}list(e){let t=this.rules.block.list.exec(e);if(t){let n=t[1].trim();const s=n.length>1,r={type:"list",raw:"",ordered:s,start:s?+n.slice(0,-1):"",loose:!1,items:[]};n=s?`\\d{1,9}\\${n.slice(-1)}`:`\\${n}`,this.options.pedantic&&(n=s?n:"[*+-]");const i=new RegExp(`^( {0,3}${n})((?:[\t ][^\\n]*)?(?:\\n|$))`);let l="",o="",a=!1;for(;e;){let n=!1;if(!(t=i.exec(e)))break;if(this.rules.block.hr.test(e))break;l=t[0],e=e.substring(l.length);let s=t[2].split("\n",1)[0].replace(/^\t+/,(e=>" ".repeat(3*e.length))),c=e.split("\n",1)[0],h=0;this.options.pedantic?(h=2,o=s.trimStart()):(h=t[2].search(/[^ ]/),h=h>4?1:h,o=s.slice(h),h+=t[1].length);let p=!1;if(!s&&/^ *$/.test(c)&&(l+=c+"\n",e=e.substring(c.length+1),n=!0),!n){const t=new RegExp(`^ {0,${Math.min(3,h-1)}}(?:[*+-]|\\d{1,9}[.)])((?:[ \t][^\\n]*)?(?:\\n|$))`),n=new RegExp(`^ {0,${Math.min(3,h-1)}}((?:- *){3,}|(?:_ *){3,}|(?:\\* *){3,})(?:\\n+|$)`),r=new RegExp(`^ {0,${Math.min(3,h-1)}}(?:\`\`\`|~~~)`),i=new RegExp(`^ {0,${Math.min(3,h-1)}}#`);for(;e;){const a=e.split("\n",1)[0];if(c=a,this.options.pedantic&&(c=c.replace(/^ {1,4}(?=( {4})*[^ ])/g," ")),r.test(c))break;if(i.test(c))break;if(t.test(c))break;if(n.test(e))break;if(c.search(/[^ ]/)>=h||!c.trim())o+="\n"+c.slice(h);else{if(p)break;if(s.search(/[^ ]/)>=4)break;if(r.test(s))break;if(i.test(s))break;if(n.test(s))break;o+="\n"+c}p||c.trim()||(p=!0),l+=a+"\n",e=e.substring(a.length+1),s=c.slice(h)}}r.loose||(a?r.loose=!0:/\n *\n *$/.test(l)&&(a=!0));let u,k=null;this.options.gfm&&(k=/^\[[ xX]\] /.exec(o),k&&(u="[ ] "!==k[0],o=o.replace(/^\[[ xX]\] +/,""))),r.items.push({type:"list_item",raw:l,task:!!k,checked:u,loose:!1,text:o,tokens:[]}),r.raw+=l}r.items[r.items.length-1].raw=l.trimEnd(),r.items[r.items.length-1].text=o.trimEnd(),r.raw=r.raw.trimEnd();for(let e=0;e<r.items.length;e++)if(this.lexer.state.top=!1,r.items[e].tokens=this.lexer.blockTokens(r.items[e].text,[]),!r.loose){const t=r.items[e].tokens.filter((e=>"space"===e.type)),n=t.length>0&&t.some((e=>/\n.*\n/.test(e.raw)));r.loose=n}if(r.loose)for(let e=0;e<r.items.length;e++)r.items[e].loose=!0;return r}}html(e){const t=this.rules.block.html.exec(e);if(t){return{type:"html",block:!0,raw:t[0],pre:"pre"===t[1]||"script"===t[1]||"style"===t[1],text:t[0]}}}def(e){const t=this.rules.block.def.exec(e);if(t){const e=t[1].toLowerCase().replace(/\s+/g," "),n=t[2]?t[2].replace(/^<(.*)>$/,"$1").replace(this.rules.inline.anyPunctuation,"$1"):"",s=t[3]?t[3].substring(1,t[3].length-1).replace(this.rules.inline.anyPunctuation,"$1"):t[3];return{type:"def",tag:e,raw:t[0],href:n,title:s}}}table(e){const t=this.rules.block.table.exec(e);if(!t)return;if(!/[:|]/.test(t[2]))return;const n=d(t[1]),s=t[2].replace(/^\||\| *$/g,"").split("|"),r=t[3]&&t[3].trim()?t[3].replace(/\n[ \t]*$/,"").split("\n"):[],i={type:"table",raw:t[0],header:[],align:[],rows:[]};if(n.length===s.length){for(const e of s)/^ *-+: *$/.test(e)?i.align.push("right"):/^ *:-+: *$/.test(e)?i.align.push("center"):/^ *:-+ *$/.test(e)?i.align.push("left"):i.align.push(null);for(const e of n)i.header.push({text:e,tokens:this.lexer.inline(e)});for(const e of r)i.rows.push(d(e,i.header.length).map((e=>({text:e,tokens:this.lexer.inline(e)}))));return i}}lheading(e){const t=this.rules.block.lheading.exec(e);if(t)return{type:"heading",raw:t[0],depth:"="===t[2].charAt(0)?1:2,text:t[1],tokens:this.lexer.inline(t[1])}}paragraph(e){const t=this.rules.block.paragraph.exec(e);if(t){const e="\n"===t[1].charAt(t[1].length-1)?t[1].slice(0,-1):t[1];return{type:"paragraph",raw:t[0],text:e,tokens:this.lexer.inline(e)}}}text(e){const t=this.rules.block.text.exec(e);if(t)return{type:"text",raw:t[0],text:t[0],tokens:this.lexer.inline(t[0])}}escape(e){const t=this.rules.inline.escape.exec(e);if(t)return{type:"escape",raw:t[0],text:c(t[1])}}tag(e){const t=this.rules.inline.tag.exec(e);if(t)return!this.lexer.state.inLink&&/^<a /i.test(t[0])?this.lexer.state.inLink=!0:this.lexer.state.inLink&&/^<\/a>/i.test(t[0])&&(this.lexer.state.inLink=!1),!this.lexer.state.inRawBlock&&/^<(pre|code|kbd|script)(\s|>)/i.test(t[0])?this.lexer.state.inRawBlock=!0:this.lexer.state.inRawBlock&&/^<\/(pre|code|kbd|script)(\s|>)/i.test(t[0])&&(this.lexer.state.inRawBlock=!1),{type:"html",raw:t[0],inLink:this.lexer.state.inLink,inRawBlock:this.lexer.state.inRawBlock,block:!1,text:t[0]}}link(e){const t=this.rules.inline.link.exec(e);if(t){const e=t[2].trim();if(!this.options.pedantic&&/^</.test(e)){if(!/>$/.test(e))return;const t=x(e.slice(0,-1),"\\");if((e.length-t.length)%2==0)return}else{const e=function(e,t){if(-1===e.indexOf(t[1]))return-1;let n=0;for(let s=0;s<e.length;s++)if("\\"===e[s])s++;else if(e[s]===t[0])n++;else if(e[s]===t[1]&&(n--,n<0))return s;return-1}(t[2],"()");if(e>-1){const n=(0===t[0].indexOf("!")?5:4)+t[1].length+e;t[2]=t[2].substring(0,e),t[0]=t[0].substring(0,n).trim(),t[3]=""}}let n=t[2],s="";if(this.options.pedantic){const e=/^([^'"]*[^\s])\s+(['"])(.*)\2/.exec(n);e&&(n=e[1],s=e[3])}else s=t[3]?t[3].slice(1,-1):"";return n=n.trim(),/^</.test(n)&&(n=this.options.pedantic&&!/>$/.test(e)?n.slice(1):n.slice(1,-1)),b(t,{href:n?n.replace(this.rules.inline.anyPunctuation,"$1"):n,title:s?s.replace(this.rules.inline.anyPunctuation,"$1"):s},t[0],this.lexer)}}reflink(e,t){let n;if((n=this.rules.inline.reflink.exec(e))||(n=this.rules.inline.nolink.exec(e))){const e=t[(n[2]||n[1]).replace(/\s+/g," ").toLowerCase()];if(!e){const e=n[0].charAt(0);return{type:"text",raw:e,text:e}}return b(n,e,n[0],this.lexer)}}emStrong(e,t,n=""){let s=this.rules.inline.emStrongLDelim.exec(e);if(!s)return;if(s[3]&&n.match(/[\p{L}\p{N}]/u))return;if(!(s[1]||s[2]||"")||!n||this.rules.inline.punctuation.exec(n)){const n=[...s[0]].length-1;let r,i,l=n,o=0;const a="*"===s[0][0]?this.rules.inline.emStrongRDelimAst:this.rules.inline.emStrongRDelimUnd;for(a.lastIndex=0,t=t.slice(-1*e.length+n);null!=(s=a.exec(t));){if(r=s[1]||s[2]||s[3]||s[4]||s[5]||s[6],!r)continue;if(i=[...r].length,s[3]||s[4]){l+=i;continue}if((s[5]||s[6])&&n%3&&!((n+i)%3)){o+=i;continue}if(l-=i,l>0)continue;i=Math.min(i,i+l+o);const t=[...s[0]][0].length,a=e.slice(0,n+s.index+t+i);if(Math.min(n,i)%2){const e=a.slice(1,-1);return{type:"em",raw:a,text:e,tokens:this.lexer.inlineTokens(e)}}const c=a.slice(2,-2);return{type:"strong",raw:a,text:c,tokens:this.lexer.inlineTokens(c)}}}}codespan(e){const t=this.rules.inline.code.exec(e);if(t){let e=t[2].replace(/\n/g," ");const n=/[^ ]/.test(e),s=/^ /.test(e)&&/ $/.test(e);return n&&s&&(e=e.substring(1,e.length-1)),e=c(e,!0),{type:"codespan",raw:t[0],text:e}}}br(e){const t=this.rules.inline.br.exec(e);if(t)return{type:"br",raw:t[0]}}del(e){const t=this.rules.inline.del.exec(e);if(t)return{type:"del",raw:t[0],text:t[2],tokens:this.lexer.inlineTokens(t[2])}}autolink(e){const t=this.rules.inline.autolink.exec(e);if(t){let e,n;return"@"===t[2]?(e=c(t[1]),n="mailto:"+e):(e=c(t[1]),n=e),{type:"link",raw:t[0],text:e,href:n,tokens:[{type:"text",raw:e,text:e}]}}}url(e){let t;if(t=this.rules.inline.url.exec(e)){let e,n;if("@"===t[2])e=c(t[0]),n="mailto:"+e;else{let s;do{s=t[0],t[0]=this.rules.inline._backpedal.exec(t[0])?.[0]??""}while(s!==t[0]);e=c(t[0]),n="www."===t[1]?"http://"+t[0]:t[0]}return{type:"link",raw:t[0],text:e,href:n,tokens:[{type:"text",raw:e,text:e}]}}}inlineText(e){const t=this.rules.inline.text.exec(e);if(t){let e;return e=this.lexer.state.inRawBlock?t[0]:c(t[0]),{type:"text",raw:t[0],text:e}}}}const m=/^ {0,3}((?:-[\t ]*){3,}|(?:_[ \t]*){3,}|(?:\*[ \t]*){3,})(?:\n+|$)/,y=/(?:[*+-]|\d{1,9}[.)])/,$=k(/^(?!bull |blockCode|fences|blockquote|heading|html)((?:.|\n(?!\s*?\n|bull |blockCode|fences|blockquote|heading|html))+?)\n {0,3}(=+|-+) *(?:\n+|$)/).replace(/bull/g,y).replace(/blockCode/g,/ {4}/).replace(/fences/g,/ {0,3}(?:`{3,}|~{3,})/).replace(/blockquote/g,/ {0,3}>/).replace(/heading/g,/ {0,3}#{1,6}/).replace(/html/g,/ {0,3}<[^\n>]+>\n/).getRegex(),z=/^([^\n]+(?:\n(?!hr|heading|lheading|blockquote|fences|list|html|table| +\n)[^\n]+)*)/,T=/(?!\s*\])(?:\\.|[^\[\]\\])+/,R=k(/^ {0,3}\[(label)\]: *(?:\n *)?([^<\s][^\s]*|<.*?>)(?:(?: +(?:\n *)?| *\n *)(title))? *(?:\n+|$)/).replace("label",T).replace("title",/(?:"(?:\\"?|[^"\\])*"|'[^'\n]*(?:\n[^'\n]+)*\n?'|$[^()]*$)/).getRegex(),_=k(/^( {0,3}bull)([ \t][^\n]+?)?(?:\n|$)/).replace(/bull/g,y).getRegex(),A="address|article|aside|base|basefont|blockquote|body|caption|center|col|colgroup|dd|details|dialog|dir|div|dl|dt|fieldset|figcaption|figure|footer|form|frame|frameset|h[1-6]|head|header|hr|html|iframe|legend|li|link|main|menu|menuitem|meta|nav|noframes|ol|optgroup|option|p|param|search|section|summary|table|tbody|td|tfoot|th|thead|title|tr|track|ul",S=/|$))/,I=k("^ {0,3}(?:<(script|pre|style|textarea)[\\s>][\\s\\S]*?(?:</\\1>[^\\n]*\\n+|$)|comment[^\\n]*(\\n+|$)|<\\?[\\s\\S]*?(?:\\?>\\n*|$)|<![A-Z][\\s\\S]*?(?:>\\n*|$)|<!\\[CDATA\\[[\\s\\S]*?(?:\\]\\]>\\n*|$)|</?(tag)(?: +|\\n|/?>)[\\s\\S]*?(?:(?:\\n *)+\\n|$)|<(?!script|pre|style|textarea)([a-z][\\w-]*)(?:attribute)*? */?>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$)|</(?!script|pre|style|textarea)[a-z][\\w-]*\\s*>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$))","i").replace("comment",S).replace("tag",A).replace("attribute",/ +[a-zA-Z:_][\w.:-]*(?: *= *"[^"\n]*"| *= *'[^'\n]*'| *= *[^\s"'=<>`]+)?/).getRegex(),E=k(z).replace("hr",m).replace("heading"," {0,3}#{1,6}(?:\\s|$)").replace("|lheading","").replace("|table","").replace("blockquote"," {0,3}>").replace("fences"," {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list"," {0,3}(?:[*+-]|1[.)]) ").replace("html","</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag",A).getRegex(),q={blockquote:k(/^( {0,3}> ?(paragraph|[^\n]*)(?:\n|$))+/).replace("paragraph",E).getRegex(),code:/^( {4}[^\n]+(?:\n(?: *(?:\n|$))*)?)+/,def:R,fences:/^ {0,3}(`{3,}(?=[^`\n]*(?:\n|$))|~{3,})([^\n]*)(?:\n|$)(?:|([\s\S]*?)(?:\n|$))(?: {0,3}\1[~`]* *(?=\n|$)|$)/,heading:/^ {0,3}(#{1,6})(?=\s|$)(.*)(?:\n+|$)/,hr:m,html:I,lheading:$,list:_,newline:/^(?: *(?:\n|$))+/,paragraph:E,table:f,text:/^[^\n]+/},Z=k("^ *([^\\n ].*)\\n {0,3}((?:\\| *)?:?-+:? *(?:\\| *:?-+:? *)*(?:\\| *)?)(?:\\n((?:(?! *\\n|hr|heading|blockquote|code|fences|list|html).*(?:\\n|$))*)\\n*|$)").replace("hr",m).replace("heading"," {0,3}#{1,6}(?:\\s|$)").replace("blockquote"," {0,3}>").replace("code"," {4}[^\\n]").replace("fences"," {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list"," {0,3}(?:[*+-]|1[.)]) ").replace("html","</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag",A).getRegex(),L={...q,table:Z,paragraph:k(z).replace("hr",m).replace("heading"," {0,3}#{1,6}(?:\\s|$)").replace("|lheading","").replace("table",Z).replace("blockquote"," {0,3}>").replace("fences"," {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n").replace("list"," {0,3}(?:[*+-]|1[.)]) ").replace("html","</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)").replace("tag",A).getRegex()},P={...q,html:k("^ *(?:comment *(?:\\n|\\s*$)|<(tag)[\\s\\S]+?</\\1> *(?:\\n{2,}|\\s*$)|<tag(?:\"[^\"]*\"|'[^']*'|\\s[^'\"/>\\s]*)*?/?> *(?:\\n{2,}|\\s*$))").replace("comment",S).replace(/tag/g,"(?!(?:a|em|strong|small|s|cite|q|dfn|abbr|data|time|code|var|samp|kbd|sub|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo|span|br|wbr|ins|del|img)\\b)\\w+(?!:|[^\\w\\s@]*@)\\b").getRegex(),def:/^ *\[([^\]]+)\]: *<?([^\s>]+)>?(?: +(["(][^\n]+[")]))? *(?:\n+|$)/,heading:/^(#{1,6})(.*)(?:\n+|$)/,fences:f,lheading:/^(.+?)\n {0,3}(=+|-+) *(?:\n+|$)/,paragraph:k(z).replace("hr",m).replace("heading"," *#{1,6} *[^\n]").replace("lheading",$).replace("|table","").replace("blockquote"," {0,3}>").replace("|fences","").replace("|list","").replace("|html","").replace("|tag","").getRegex()},Q=/^\$[!"#$%&'()*+,\-./:;<=>?@\[\]\\^_`{|}~])/,v=/^( {2,}|\$\n(?!\s*$)/,B="\\p{P}\\p{S}",C=k(/^((?![*_])[\spunctuation])/,"u").replace(/punctuation/g,B).getRegex(),M=k(/^(?:\*+(?:((?!\*)[punct])|[^\s*]))|^_+(?:((?!_)[punct])|([^\s_]))/,"u").replace(/punct/g,B).getRegex(),O=k("^[^_*]*?__[^_*]*?\\*[^_*]*?(?=__)|[^*]+(?=[^*])|(?!\\*)[punct](\\*+)(?=[\\s]|$)|[^punct\\s](\\*+)(?!\\*)(?=[punct\\s]|$)|(?!\\*)[punct\\s](\\*+)(?=[^punct\\s])|[\\s](\\*+)(?!\\*)(?=[punct])|(?!\\*)[punct](\\*+)(?!\\*)(?=[punct])|[^punct\\s](\\*+)(?=[^punct\\s])","gu").replace(/punct/g,B).getRegex(),D=k("^[^_*]*?\\*\\*[^_*]*?_[^_*]*?(?=\\*\\*)|[^_]+(?=[^_])|(?!_)[punct](_+)(?=[\\s]|$)|[^punct\\s](_+)(?!_)(?=[punct\\s]|$)|(?!_)[punct\\s](_+)(?=[^punct\\s])|[\\s](_+)(?!_)(?=[punct])|(?!_)[punct](_+)(?!_)(?=[punct])","gu").replace(/punct/g,B).getRegex(),j=k(/\$[punct])/,"gu").replace(/punct/g,B).getRegex(),H=k(/^<(scheme:[^\s\x00-\x1f<>]*|email)>/).replace("scheme",/[a-zA-Z][a-zA-Z0-9+.-]{1,31}/).replace("email",/[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+(@)[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+(?![-_])/).getRegex(),U=k(S).replace("(?:--\x3e|$)","--\x3e").getRegex(),X=k("^comment|^</[a-zA-Z][\\w:-]*\\s*>|^<[a-zA-Z][\\w-]*(?:attribute)*?\\s*/?>|^<\\?[\\s\\S]*?\\?>|^<![a-zA-Z]+\\s[\\s\\S]*?>|^<!\\[CDATA\\[[\\s\\S]*?\\]\\]>").replace("comment",U).replace("attribute",/\s+[a-zA-Z:_][\w.:-]*(?:\s*=\s*"[^"]*"|\s*=\s*'[^']*'|\s*=\s*[^\s"'=<>`]+)?/).getRegex(),F=/(?:\[(?:\\.|[^\[\]\\])*\]|\\.|`[^`]*`|[^\[\]\\`])*?/,N=k(/^!?\[(label)\]\(\s*(href)(?:\s+(title))?\s*$/).replace("label",F).replace("href",/<(?:\\.|[^\n<>\\])+>|[^\s\x00-\x1f]*/).replace("title",/"(?:\\"?|[^"\\])*"|'(?:\\'?|[^'\\])*'|$(?:\\$?|[^)\\])*\)/).getRegex(),G=k(/^!?\[(label)\]\[(ref)\]/).replace("label",F).replace("ref",T).getRegex(),J=k(/^!?\[(ref)\](?:\[\])?/).replace("ref",T).getRegex(),K={_backpedal:f,anyPunctuation:j,autolink:H,blockSkip:/\[[^[\]]*?\]$[^\($]*?\)|`[^`]*?`|<[^<>]*?>/g,br:v,code:/^(`+)([^`]|[^`][\s\S]*?[^`])\1(?!`)/,del:f,emStrongLDelim:M,emStrongRDelimAst:O,emStrongRDelimUnd:D,escape:Q,link:N,nolink:J,punctuation:C,reflink:G,reflinkSearch:k("reflink|nolink(?!\$)","g").replace("reflink",G).replace("nolink",J).getRegex(),tag:X,text:/^(`+|[^`])(?:(?= {2,}\n)|[\s\S]*?(?:(?=[\\<!\[`*_]|\b_|$)|[^ ](?= {2,}\n)))/,url:f},V={...K,link:k(/^!?\[(label)\]\((.*?)$/).replace("label",F).getRegex(),reflink:k(/^!?\[(label)\]\s*\[([^\]]*)\]/).replace("label",F).getRegex()},W={...K,escape:k(Q).replace("])","~|])").getRegex(),url:k(/^((?:ftp|https?):\/\/|www\.)(?:[a-zA-Z0-9\-]+\.?)+[^\s<]*|^email/,"i").replace("email",/[A-Za-z0-9._+-]+(@)[a-zA-Z0-9-_]+(?:\.[a-zA-Z0-9-_]*[a-zA-Z0-9])+(?![-_])/).getRegex(),_backpedal:/(?:[^?!.,:;*_'"~()&]+|$[^)]*$|&(?![a-zA-Z0-9]+;$)|[?!.,:;*_'"~)]+(?!$))+/,del:/^(~~?)(?=[^\s~])([\s\S]*?[^\s~])\1(?=[^~]|$)/,text:/^([`~]+|[^`~])(?:(?= {2,}\n)|(?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)|[\s\S]*?(?:(?=[\\<!\[`*~_]|\b_|https?:\/\/|ftp:\/\/|www\.|$)|[^ ](?= {2,}\n)|[^a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-](?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)))/},Y={...W,br:k(v).replace("{2,}","*").getRegex(),text:k(W.text).replace("\\b_","\\b_| {2,}\\n").replace(/\{2,\}/g,"*").getRegex()},ee={normal:q,gfm:L,pedantic:P},te={normal:K,gfm:W,breaks:Y,pedantic:V};class ne{tokens;options;state;tokenizer;inlineQueue;constructor(t){this.tokens=[],this.tokens.links=Object.create(null),this.options=t||e.defaults,this.options.tokenizer=this.options.tokenizer||new w,this.tokenizer=this.options.tokenizer,this.tokenizer.options=this.options,this.tokenizer.lexer=this,this.inlineQueue=[],this.state={inLink:!1,inRawBlock:!1,top:!0};const n={block:ee.normal,inline:te.normal};this.options.pedantic?(n.block=ee.pedantic,n.inline=te.pedantic):this.options.gfm&&(n.block=ee.gfm,this.options.breaks?n.inline=te.breaks:n.inline=te.gfm),this.tokenizer.rules=n}static get rules(){return{block:ee,inline:te}}static lex(e,t){return new ne(t).lex(e)}static lexInline(e,t){return new ne(t).inlineTokens(e)}lex(e){e=e.replace(/\r\n|\r/g,"\n"),this.blockTokens(e,this.tokens);for(let e=0;e<this.inlineQueue.length;e++){const t=this.inlineQueue[e];this.inlineTokens(t.src,t.tokens)}return this.inlineQueue=[],this.tokens}blockTokens(e,t=[]){let n,s,r,i;for(e=this.options.pedantic?e.replace(/\t/g," ").replace(/^ +$/gm,""):e.replace(/^( *)(\t+)/gm,((e,t,n)=>t+" ".repeat(n.length)));e;)if(!(this.options.extensions&&this.options.extensions.block&&this.options.extensions.block.some((s=>!!(n=s.call({lexer:this},e,t))&&(e=e.substring(n.raw.length),t.push(n),!0)))))if(n=this.tokenizer.space(e))e=e.substring(n.raw.length),1===n.raw.length&&t.length>0?t[t.length-1].raw+="\n":t.push(n);else if(n=this.tokenizer.code(e))e=e.substring(n.raw.length),s=t[t.length-1],!s||"paragraph"!==s.type&&"text"!==s.type?t.push(n):(s.raw+="\n"+n.raw,s.text+="\n"+n.text,this.inlineQueue[this.inlineQueue.length-1].src=s.text);else if(n=this.tokenizer.fences(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.heading(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.hr(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.blockquote(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.list(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.html(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.def(e))e=e.substring(n.raw.length),s=t[t.length-1],!s||"paragraph"!==s.type&&"text"!==s.type?this.tokens.links[n.tag]||(this.tokens.links[n.tag]={href:n.href,title:n.title}):(s.raw+="\n"+n.raw,s.text+="\n"+n.raw,this.inlineQueue[this.inlineQueue.length-1].src=s.text);else if(n=this.tokenizer.table(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.lheading(e))e=e.substring(n.raw.length),t.push(n);else{if(r=e,this.options.extensions&&this.options.extensions.startBlock){let t=1/0;const n=e.slice(1);let s;this.options.extensions.startBlock.forEach((e=>{s=e.call({lexer:this},n),"number"==typeof s&&s>=0&&(t=Math.min(t,s))})),t<1/0&&t>=0&&(r=e.substring(0,t+1))}if(this.state.top&&(n=this.tokenizer.paragraph(r)))s=t[t.length-1],i&&"paragraph"===s.type?(s.raw+="\n"+n.raw,s.text+="\n"+n.text,this.inlineQueue.pop(),this.inlineQueue[this.inlineQueue.length-1].src=s.text):t.push(n),i=r.length!==e.length,e=e.substring(n.raw.length);else if(n=this.tokenizer.text(e))e=e.substring(n.raw.length),s=t[t.length-1],s&&"text"===s.type?(s.raw+="\n"+n.raw,s.text+="\n"+n.text,this.inlineQueue.pop(),this.inlineQueue[this.inlineQueue.length-1].src=s.text):t.push(n);else if(e){const t="Infinite loop on byte: "+e.charCodeAt(0);if(this.options.silent){console.error(t);break}throw new Error(t)}}return this.state.top=!0,t}inline(e,t=[]){return this.inlineQueue.push({src:e,tokens:t}),t}inlineTokens(e,t=[]){let n,s,r,i,l,o,a=e;if(this.tokens.links){const e=Object.keys(this.tokens.links);if(e.length>0)for(;null!=(i=this.tokenizer.rules.inline.reflinkSearch.exec(a));)e.includes(i[0].slice(i[0].lastIndexOf("[")+1,-1))&&(a=a.slice(0,i.index)+"["+"a".repeat(i[0].length-2)+"]"+a.slice(this.tokenizer.rules.inline.reflinkSearch.lastIndex))}for(;null!=(i=this.tokenizer.rules.inline.blockSkip.exec(a));)a=a.slice(0,i.index)+"["+"a".repeat(i[0].length-2)+"]"+a.slice(this.tokenizer.rules.inline.blockSkip.lastIndex);for(;null!=(i=this.tokenizer.rules.inline.anyPunctuation.exec(a));)a=a.slice(0,i.index)+"++"+a.slice(this.tokenizer.rules.inline.anyPunctuation.lastIndex);for(;e;)if(l||(o=""),l=!1,!(this.options.extensions&&this.options.extensions.inline&&this.options.extensions.inline.some((s=>!!(n=s.call({lexer:this},e,t))&&(e=e.substring(n.raw.length),t.push(n),!0)))))if(n=this.tokenizer.escape(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.tag(e))e=e.substring(n.raw.length),s=t[t.length-1],s&&"text"===n.type&&"text"===s.type?(s.raw+=n.raw,s.text+=n.text):t.push(n);else if(n=this.tokenizer.link(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.reflink(e,this.tokens.links))e=e.substring(n.raw.length),s=t[t.length-1],s&&"text"===n.type&&"text"===s.type?(s.raw+=n.raw,s.text+=n.text):t.push(n);else if(n=this.tokenizer.emStrong(e,a,o))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.codespan(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.br(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.del(e))e=e.substring(n.raw.length),t.push(n);else if(n=this.tokenizer.autolink(e))e=e.substring(n.raw.length),t.push(n);else if(this.state.inLink||!(n=this.tokenizer.url(e))){if(r=e,this.options.extensions&&this.options.extensions.startInline){let t=1/0;const n=e.slice(1);let s;this.options.extensions.startInline.forEach((e=>{s=e.call({lexer:this},n),"number"==typeof s&&s>=0&&(t=Math.min(t,s))})),t<1/0&&t>=0&&(r=e.substring(0,t+1))}if(n=this.tokenizer.inlineText(r))e=e.substring(n.raw.length),"_"!==n.raw.slice(-1)&&(o=n.raw.slice(-1)),l=!0,s=t[t.length-1],s&&"text"===s.type?(s.raw+=n.raw,s.text+=n.text):t.push(n);else if(e){const t="Infinite loop on byte: "+e.charCodeAt(0);if(this.options.silent){console.error(t);break}throw new Error(t)}}else e=e.substring(n.raw.length),t.push(n);return t}}class se{options;constructor(t){this.options=t||e.defaults}code(e,t,n){const s=(t||"").match(/^\S*/)?.[0];return e=e.replace(/\n$/,"")+"\n",s?'<pre><code class="language-'+c(s)+'">'+(n?e:c(e,!0))+"</code></pre>\n":"<pre><code>"+(n?e:c(e,!0))+"</code></pre>\n"}blockquote(e){return`<blockquote>\n${e}</blockquote>\n`}html(e,t){return e}heading(e,t,n){return`<h${t}>${e}</h${t}>\n`}hr(){return"<hr>\n"}list(e,t,n){const s=t?"ol":"ul";return"<"+s+(t&&1!==n?' start="'+n+'"':"")+">\n"+e+"</"+s+">\n"}listitem(e,t,n){return`<li>${e}</li>\n`}checkbox(e){return"<input "+(e?'checked="" ':"")+'disabled="" type="checkbox">'}paragraph(e){return`<p>${e}</p>\n`}table(e,t){return t&&(t=`<tbody>${t}</tbody>`),"<table>\n<thead>\n"+e+"</thead>\n"+t+"</table>\n"}tablerow(e){return`<tr>\n${e}</tr>\n`}tablecell(e,t){const n=t.header?"th":"td";return(t.align?`<${n} align="${t.align}">`:`<${n}>`)+e+`</${n}>\n`}strong(e){return`<strong>${e}</strong>`}em(e){return`<em>${e}</em>`}codespan(e){return`<code>${e}</code>`}br(){return"<br>"}del(e){return`<del>${e}</del>`}link(e,t,n){const s=g(e);if(null===s)return n;let r='<a href="'+(e=s)+'"';return t&&(r+=' title="'+t+'"'),r+=">"+n+"</a>",r}image(e,t,n){const s=g(e);if(null===s)return n;let r=`<img src="${e=s}" alt="${n}"`;return t&&(r+=` title="${t}"`),r+=">",r}text(e){return e}}class re{strong(e){return e}em(e){return e}codespan(e){return e}del(e){return e}html(e){return e}text(e){return e}link(e,t,n){return""+n}image(e,t,n){return""+n}br(){return""}}class ie{options;renderer;textRenderer;constructor(t){this.options=t||e.defaults,this.options.renderer=this.options.renderer||new se,this.renderer=this.options.renderer,this.renderer.options=this.options,this.textRenderer=new re}static parse(e,t){return new ie(t).parse(e)}static parseInline(e,t){return new ie(t).parseInline(e)}parse(e,t=!0){let n="";for(let s=0;s<e.length;s++){const r=e[s];if(this.options.extensions&&this.options.extensions.renderers&&this.options.extensions.renderers[r.type]){const e=r,t=this.options.extensions.renderers[e.type].call({parser:this},e);if(!1!==t||!["space","hr","heading","code","table","blockquote","list","html","paragraph","text"].includes(e.type)){n+=t||"";continue}}switch(r.type){case"space":continue;case"hr":n+=this.renderer.hr();continue;case"heading":{const e=r;n+=this.renderer.heading(this.parseInline(e.tokens),e.depth,p(this.parseInline(e.tokens,this.textRenderer)));continue}case"code":{const e=r;n+=this.renderer.code(e.text,e.lang,!!e.escaped);continue}case"table":{const e=r;let t="",s="";for(let t=0;t<e.header.length;t++)s+=this.renderer.tablecell(this.parseInline(e.header[t].tokens),{header:!0,align:e.align[t]});t+=this.renderer.tablerow(s);let i="";for(let t=0;t<e.rows.length;t++){const n=e.rows[t];s="";for(let t=0;t<n.length;t++)s+=this.renderer.tablecell(this.parseInline(n[t].tokens),{header:!1,align:e.align[t]});i+=this.renderer.tablerow(s)}n+=this.renderer.table(t,i);continue}case"blockquote":{const e=r,t=this.parse(e.tokens);n+=this.renderer.blockquote(t);continue}case"list":{const e=r,t=e.ordered,s=e.start,i=e.loose;let l="";for(let t=0;t<e.items.length;t++){const n=e.items[t],s=n.checked,r=n.task;let o="";if(n.task){const e=this.renderer.checkbox(!!s);i?n.tokens.length>0&&"paragraph"===n.tokens[0].type?(n.tokens[0].text=e+" "+n.tokens[0].text,n.tokens[0].tokens&&n.tokens[0].tokens.length>0&&"text"===n.tokens[0].tokens[0].type&&(n.tokens[0].tokens[0].text=e+" "+n.tokens[0].tokens[0].text)):n.tokens.unshift({type:"text",text:e+" "}):o+=e+" "}o+=this.parse(n.tokens,i),l+=this.renderer.listitem(o,r,!!s)}n+=this.renderer.list(l,t,s);continue}case"html":{const e=r;n+=this.renderer.html(e.text,e.block);continue}case"paragraph":{const e=r;n+=this.renderer.paragraph(this.parseInline(e.tokens));continue}case"text":{let i=r,l=i.tokens?this.parseInline(i.tokens):i.text;for(;s+1<e.length&&"text"===e[s+1].type;)i=e[++s],l+="\n"+(i.tokens?this.parseInline(i.tokens):i.text);n+=t?this.renderer.paragraph(l):l;continue}default:{const e='Token with "'+r.type+'" type was not found.';if(this.options.silent)return console.error(e),"";throw new Error(e)}}}return n}parseInline(e,t){t=t||this.renderer;let n="";for(let s=0;s<e.length;s++){const r=e[s];if(this.options.extensions&&this.options.extensions.renderers&&this.options.extensions.renderers[r.type]){const e=this.options.extensions.renderers[r.type].call({parser:this},r);if(!1!==e||!["escape","html","link","image","strong","em","codespan","br","del","text"].includes(r.type)){n+=e||"";continue}}switch(r.type){case"escape":{const e=r;n+=t.text(e.text);break}case"html":{const e=r;n+=t.html(e.text);break}case"link":{const e=r;n+=t.link(e.href,e.title,this.parseInline(e.tokens,t));break}case"image":{const e=r;n+=t.image(e.href,e.title,e.text);break}case"strong":{const e=r;n+=t.strong(this.parseInline(e.tokens,t));break}case"em":{const e=r;n+=t.em(this.parseInline(e.tokens,t));break}case"codespan":{const e=r;n+=t.codespan(e.text);break}case"br":n+=t.br();break;case"del":{const e=r;n+=t.del(this.parseInline(e.tokens,t));break}case"text":{const e=r;n+=t.text(e.text);break}default:{const e='Token with "'+r.type+'" type was not found.';if(this.options.silent)return console.error(e),"";throw new Error(e)}}}return n}}class le{options;constructor(t){this.options=t||e.defaults}static passThroughHooks=new Set(["preprocess","postprocess","processAllTokens"]);preprocess(e){return e}postprocess(e){return e}processAllTokens(e){return e}}class oe{defaults={async:!1,breaks:!1,extensions:null,gfm:!0,hooks:null,pedantic:!1,renderer:null,silent:!1,tokenizer:null,walkTokens:null};options=this.setOptions;parse=this.#e(ne.lex,ie.parse);parseInline=this.#e(ne.lexInline,ie.parseInline);Parser=ie;Renderer=se;TextRenderer=re;Lexer=ne;Tokenizer=w;Hooks=le;constructor(...e){this.use(...e)}walkTokens(e,t){let n=[];for(const s of e)switch(n=n.concat(t.call(this,s)),s.type){case"table":{const e=s;for(const s of e.header)n=n.concat(this.walkTokens(s.tokens,t));for(const s of e.rows)for(const e of s)n=n.concat(this.walkTokens(e.tokens,t));break}case"list":{const e=s;n=n.concat(this.walkTokens(e.items,t));break}default:{const e=s;this.defaults.extensions?.childTokens?.[e.type]?this.defaults.extensions.childTokens[e.type].forEach((s=>{const r=e[s].flat(1/0);n=n.concat(this.walkTokens(r,t))})):e.tokens&&(n=n.concat(this.walkTokens(e.tokens,t)))}}return n}use(...e){const t=this.defaults.extensions||{renderers:{},childTokens:{}};return e.forEach((e=>{const n={...e};if(n.async=this.defaults.async||n.async||!1,e.extensions&&(e.extensions.forEach((e=>{if(!e.name)throw new Error("extension name required");if("renderer"in e){const n=t.renderers[e.name];t.renderers[e.name]=n?function(...t){let s=e.renderer.apply(this,t);return!1===s&&(s=n.apply(this,t)),s}:e.renderer}if("tokenizer"in e){if(!e.level||"block"!==e.level&&"inline"!==e.level)throw new Error("extension level must be 'block' or 'inline'");const n=t[e.level];n?n.unshift(e.tokenizer):t[e.level]=[e.tokenizer],e.start&&("block"===e.level?t.startBlock?t.startBlock.push(e.start):t.startBlock=[e.start]:"inline"===e.level&&(t.startInline?t.startInline.push(e.start):t.startInline=[e.start]))}"childTokens"in e&&e.childTokens&&(t.childTokens[e.name]=e.childTokens)})),n.extensions=t),e.renderer){const t=this.defaults.renderer||new se(this.defaults);for(const n in e.renderer){if(!(n in t))throw new Error(`renderer '${n}' does not exist`);if("options"===n)continue;const s=n,r=e.renderer[s],i=t[s];t[s]=(...e)=>{let n=r.apply(t,e);return!1===n&&(n=i.apply(t,e)),n||""}}n.renderer=t}if(e.tokenizer){const t=this.defaults.tokenizer||new w(this.defaults);for(const n in e.tokenizer){if(!(n in t))throw new Error(`tokenizer '${n}' does not exist`);if(["options","rules","lexer"].includes(n))continue;const s=n,r=e.tokenizer[s],i=t[s];t[s]=(...e)=>{let n=r.apply(t,e);return!1===n&&(n=i.apply(t,e)),n}}n.tokenizer=t}if(e.hooks){const t=this.defaults.hooks||new le;for(const n in e.hooks){if(!(n in t))throw new Error(`hook '${n}' does not exist`);if("options"===n)continue;const s=n,r=e.hooks[s],i=t[s];le.passThroughHooks.has(n)?t[s]=e=>{if(this.defaults.async)return Promise.resolve(r.call(t,e)).then((e=>i.call(t,e)));const n=r.call(t,e);return i.call(t,n)}:t[s]=(...e)=>{let n=r.apply(t,e);return!1===n&&(n=i.apply(t,e)),n}}n.hooks=t}if(e.walkTokens){const t=this.defaults.walkTokens,s=e.walkTokens;n.walkTokens=function(e){let n=[];return n.push(s.call(this,e)),t&&(n=n.concat(t.call(this,e))),n}}this.defaults={...this.defaults,...n}})),this}setOptions(e){return this.defaults={...this.defaults,...e},this}lexer(e,t){return ne.lex(e,t??this.defaults)}parser(e,t){return ie.parse(e,t??this.defaults)}#e(e,t){return(n,s)=>{const r={...s},i={...this.defaults,...r};!0===this.defaults.async&&!1===r.async&&(i.silent||console.warn("marked(): The async option was set to true by an extension. The async: false option sent to parse will be ignored."),i.async=!0);const l=this.#t(!!i.silent,!!i.async);if(null==n)return l(new Error("marked(): input parameter is undefined or null"));if("string"!=typeof n)return l(new Error("marked(): input parameter is of type "+Object.prototype.toString.call(n)+", string expected"));if(i.hooks&&(i.hooks.options=i),i.async)return Promise.resolve(i.hooks?i.hooks.preprocess(n):n).then((t=>e(t,i))).then((e=>i.hooks?i.hooks.processAllTokens(e):e)).then((e=>i.walkTokens?Promise.all(this.walkTokens(e,i.walkTokens)).then((()=>e)):e)).then((e=>t(e,i))).then((e=>i.hooks?i.hooks.postprocess(e):e)).catch(l);try{i.hooks&&(n=i.hooks.preprocess(n));let s=e(n,i);i.hooks&&(s=i.hooks.processAllTokens(s)),i.walkTokens&&this.walkTokens(s,i.walkTokens);let r=t(s,i);return i.hooks&&(r=i.hooks.postprocess(r)),r}catch(e){return l(e)}}}#t(e,t){return n=>{if(n.message+="\nPlease report this to https://github.com/markedjs/marked.",e){const e="<p>An error occurred:</p><pre>"+c(n.message+"",!0)+"</pre>";return t?Promise.resolve(e):e}if(t)return Promise.reject(n);throw n}}}const ae=new oe;function ce(e,t){return ae.parse(e,t)}ce.options=ce.setOptions=function(e){return ae.setOptions(e),ce.defaults=ae.defaults,n(ce.defaults),ce},ce.getDefaults=t,ce.defaults=e.defaults,ce.use=function(...e){return ae.use(...e),ce.defaults=ae.defaults,n(ce.defaults),ce},ce.walkTokens=function(e,t){return ae.walkTokens(e,t)},ce.parseInline=ae.parseInline,ce.Parser=ie,ce.parser=ie.parse,ce.Renderer=se,ce.TextRenderer=re,ce.Lexer=ne,ce.lexer=ne.lex,ce.Tokenizer=w,ce.Hooks=le,ce.parse=ce;const he=ce.options,pe=ce.setOptions,ue=ce.use,ke=ce.walkTokens,ge=ce.parseInline,fe=ce,de=ie.parse,xe=ne.lex;e.Hooks=le,e.Lexer=ne,e.Marked=oe,e.Parser=ie,e.Renderer=se,e.TextRenderer=re,e.Tokenizer=w,e.getDefaults=t,e.lexer=xe,e.marked=ce,e.options=he,e.parse=fe,e.parseInline=ge,e.parser=de,e.setOptions=pe,e.use=ue,e.walkTokens=ke}));
</script>
<script>
const PRESETS = {"claude": "# CLAUDE.md\n\nBehavioral guidelines to reduce common LLM coding mistakes. Merge with project-specific instructions as needed.\n\n**Tradeoff:** These guidelines bias toward caution over speed. For trivial tasks, use judgment.\n\n## 1. Think Before Coding\n\n**Don't assume. Don't hide confusion. Surface tradeoffs.**\n\nBefore implementing:\n- State your assumptions explicitly. If uncertain, ask.\n- If multiple interpretations exist, present them - don't pick silently.\n- If a simpler approach exists, say so. Push back when warranted.\n- If something is unclear, stop. Name what's confusing. Ask.\n\n## 2. Simplicity First\n\n**Minimum code that solves the problem. Nothing speculative.**\n\n- No features beyond what was asked.\n- No abstractions for single-use code.\n- No \"flexibility\" or \"configurability\" that wasn't requested.\n- No error handling for impossible scenarios.\n- If you write 200 lines and it could be 50, rewrite it.\n\nAsk yourself: \"Would a senior engineer say this is overcomplicated?\" If yes, simplify.\n\n## 3. Surgical Changes\n\n**Touch only what you must. Clean up only your own mess.**\n\nWhen editing existing code:\n- Don't \"improve\" adjacent code, comments, or formatting.\n- Don't refactor things that aren't broken.\n- Match existing style, even if you'd do it differently.\n- If you notice unrelated dead code, mention it - don't delete it.\n\nWhen your changes create orphans:\n- Remove imports/variables/functions that YOUR changes made unused.\n- Don't remove pre-existing dead code unless asked.\n\nThe test: Every changed line should trace directly to the user's request.\n\n## 4. Goal-Driven Execution\n\n**Define success criteria. Loop until verified.**\n\nTransform tasks into verifiable goals:\n- \"Add validation\" → \"Write tests for invalid inputs, then make them pass\"\n- \"Fix the bug\" → \"Write a test that reproduces it, then make it pass\"\n- \"Refactor X\" → \"Ensure tests pass before and after\"\n\nFor multi-step tasks, state a brief plan:\n```\n1. [Step] → verify: [check]\n2. [Step] → verify: [check]\n3. [Step] → verify: [check]\n```\n\nStrong success criteria let you loop independently. Weak criteria (\"make it work\") require constant clarification.\n\n---\n\n**These guidelines are working if:** fewer unnecessary changes in diffs, fewer rewrites due to overcomplication, and clarifying questions come before implementation rather than after mistakes.\n", "example": "# 서원지기: 조선 서원 배향 인물 지식그래프\n\n## 1. 프로젝트 소개\n우리 팀은 **조선시대 서원 기록**을 바탕으로 서원과 배향 인물, 학맥의 관계를 지식그래프로 구축합니다.\n\n## 2. 팀원\n- 김가람 (사학과) — 데이터 수집\n- 이나래 (국어국문학과) — 그래프 설계\n- 박다온 (철학과) — 시각화·해석\n\n## 3. 데이터 출처\n- [한국학자료센터](https://kostma.aks.ac.kr)\n\n## 4. 그래프 설계\n| 노드 | 주요 속성 |\n|---|---|\n| Person | name, birth, death |\n| Seowon | name, region |\n\n## 5. 진행 상황\n- [x] 데이터셋 선정\n- [ ] 노드·관계 설계\n- [ ] 중간발표 준비", "blank": "# (팀 이름): (프로젝트 제목)\n\n## 1. 프로젝트 소개\n우리 팀은 **(데이터셋 이름)** 자료를 바탕으로 (무엇과 무엇의 관계)를 지식그래프로 구축합니다.\n\n## 2. 팀원\n- (이름) (학과) — (역할)\n- (이름) (학과) — (역할)\n- (이름) (학과) — (역할)\n\n## 3. 데이터 출처\n- [(출처 이름)]((출처 주소))\n\n## 4. 그래프 설계\n| 노드 | 주요 속성 |\n|---|---|\n| (노드 이름) | (속성1), (속성2) |\n\n## 5. 진행 상황\n- [ ] 데이터셋 선정\n- [ ] 노드·관계 설계\n- [ ] 중간발표 준비"};
const src = document.getElementById('src'), out = document.getElementById('out');
marked.setOptions({gfm:true, breaks:false});
function render(){ out.innerHTML = marked.parse(src.value); try{localStorage.setItem('md-draft', src.value);}catch(e){} }
src.addEventListener('input', render);
document.querySelectorAll('[data-preset]').forEach(b => b.onclick = () => {
if (src.value.trim() && !confirm('지금 작성한 내용이 지워집니다. 계속할까요?')) return;
src.value = PRESETS[b.dataset.preset]; render();
});
document.getElementById('clear').onclick = () => { if (confirm('내용을 모두 지울까요?')) { src.value = ''; render(); } };
document.getElementById('save').onclick = () => {
const a = document.createElement('a');
a.href = URL.createObjectURL(new Blob([src.value], {type:'text/markdown'}));
a.download = 'README.md'; a.click(); URL.revokeObjectURL(a.href);
};
let draft = null; try{ draft = localStorage.getItem('md-draft'); }catch(e){}
src.value = draft || PRESETS.claude; render();
</script>
</body>
</html>

마크다운연습

2026-10-23T16:15:46Z

Kimseoyun:

<div style="padding:14px 16px; border-left:4px solid #1d4ed8; background:#eff6ff; margin:0 0 24px 0;">
<strong>💡 이 페이지 보는 법</strong><br>
왼쪽은 <code>CLAUDE.md</code> 파일에 실제로 입력된 마크다운 원문이고, 오른쪽은 깃허브나 AI 도구처럼 마크다운을 지원하는 환경에서 그 원문이 보이는 모습입니다. 이 위키는 마크다운을 직접 해석하지 않기 때문에, 오른쪽 화면은 같은 모양을 HTML로 재현한 것입니다.
</div>

{{마크다운비교
|제목=① 문서 제목과 소개문
|문법=제목(#) · 문단
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;"># CLAUDE.md

Behavioral guidelines to reduce common LLM coding mistakes. Merge with project-specific instructions as needed.</pre>
|결과=<div style="font-size:1.6em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">CLAUDE.md</div>
<p style="margin:0;">Behavioral guidelines to reduce common LLM coding mistakes. Merge with project-specific instructions as needed.</p>
}}

{{마크다운비교
|제목=② 강조 문단
|문법=굵게(**)
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">**Tradeoff:** These guidelines bias toward caution over speed. For trivial tasks, use judgment.</pre>
|결과=<p style="margin:0;"><strong>Tradeoff:</strong> These guidelines bias toward caution over speed. For trivial tasks, use judgment.</p>
}}

{{마크다운비교
|제목=③ 1번 원칙
|문법=제목(##) · 굵게 · 목록(-)
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 1. Think Before Coding

**Don't assume. Don't hide confusion. Surface tradeoffs.**

Before implementing:
- State your assumptions explicitly. If uncertain, ask.
- If multiple interpretations exist, present them - don't pick silently.
- If a simpler approach exists, say so. Push back when warranted.
- If something is unclear, stop. Name what's confusing. Ask.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">1. Think Before Coding</div>
<p style="margin:0 0 10px 0;"><strong>Don't assume. Don't hide confusion. Surface tradeoffs.</strong></p>
<p style="margin:0 0 4px 0;">Before implementing:</p>
<ul style="margin:0;">
<li>State your assumptions explicitly. If uncertain, ask.</li>
<li>If multiple interpretations exist, present them - don't pick silently.</li>
<li>If a simpler approach exists, say so. Push back when warranted.</li>
<li>If something is unclear, stop. Name what's confusing. Ask.</li>
</ul>
}}

{{마크다운비교
|제목=④ 2번 원칙
|문법=제목(##) · 굵게 · 목록(-) · 문단
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 2. Simplicity First

**Minimum code that solves the problem. Nothing speculative.**

- No features beyond what was asked.
- No abstractions for single-use code.
- No "flexibility" or "configurability" that wasn't requested.
- No error handling for impossible scenarios.
- If you write 200 lines and it could be 50, rewrite it.

Ask yourself: "Would a senior engineer say this is overcomplicated?" If yes, simplify.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">2. Simplicity First</div>
<p style="margin:0 0 10px 0;"><strong>Minimum code that solves the problem. Nothing speculative.</strong></p>
<ul style="margin:0 0 10px 0;">
<li>No features beyond what was asked.</li>
<li>No abstractions for single-use code.</li>
<li>No "flexibility" or "configurability" that wasn't requested.</li>
<li>No error handling for impossible scenarios.</li>
<li>If you write 200 lines and it could be 50, rewrite it.</li>
</ul>
<p style="margin:0;">Ask yourself: "Would a senior engineer say this is overcomplicated?" If yes, simplify.</p>
}}

{{마크다운비교
|제목=⑤ 3번 원칙
|문법=제목(##) · 굵게 · 목록 두 묶음
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 3. Surgical Changes

**Touch only what you must. Clean up only your own mess.**

When editing existing code:
- Don't "improve" adjacent code, comments, or formatting.
- Don't refactor things that aren't broken.
- Match existing style, even if you'd do it differently.
- If you notice unrelated dead code, mention it - don't delete it.

When your changes create orphans:
- Remove imports/variables/functions that YOUR changes made unused.
- Don't remove pre-existing dead code unless asked.

The test: Every changed line should trace directly to the user's request.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">3. Surgical Changes</div>
<p style="margin:0 0 10px 0;"><strong>Touch only what you must. Clean up only your own mess.</strong></p>
<p style="margin:0 0 4px 0;">When editing existing code:</p>
<ul style="margin:0 0 10px 0;">
<li>Don't "improve" adjacent code, comments, or formatting.</li>
<li>Don't refactor things that aren't broken.</li>
<li>Match existing style, even if you'd do it differently.</li>
<li>If you notice unrelated dead code, mention it - don't delete it.</li>
</ul>
<p style="margin:0 0 4px 0;">When your changes create orphans:</p>
<ul style="margin:0 0 10px 0;">
<li>Remove imports/variables/functions that YOUR changes made unused.</li>
<li>Don't remove pre-existing dead code unless asked.</li>
</ul>
<p style="margin:0;">The test: Every changed line should trace directly to the user's request.</p>
}}

{{마크다운비교
|제목=⑥ 4번 원칙
|문법=제목(##) · 굵게 · 목록 · 코드 블록(```)
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">## 4. Goal-Driven Execution

**Define success criteria. Loop until verified.**

Transform tasks into verifiable goals:
- "Add validation" → "Write tests for invalid inputs, then make them pass"
- "Fix the bug" → "Write a test that reproduces it, then make it pass"
- "Refactor X" → "Ensure tests pass before and after"

For multi-step tasks, state a brief plan:
```
1. [Step] → verify: [check]
2. [Step] → verify: [check]
3. [Step] → verify: [check]
```

Strong success criteria let you loop independently. Weak criteria ("make it work") require constant clarification.</pre>
|결과=<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">4. Goal-Driven Execution</div>
<p style="margin:0 0 10px 0;"><strong>Define success criteria. Loop until verified.</strong></p>
<p style="margin:0 0 4px 0;">Transform tasks into verifiable goals:</p>
<ul style="margin:0 0 10px 0;">
<li>"Add validation" → "Write tests for invalid inputs, then make them pass"</li>
<li>"Fix the bug" → "Write a test that reproduces it, then make it pass"</li>
<li>"Refactor X" → "Ensure tests pass before and after"</li>
</ul>
<p style="margin:0 0 4px 0;">For multi-step tasks, state a brief plan:</p>
<pre style="margin:0 0 10px 0; padding:12px; white-space:pre-wrap; font-size:13px; background:#f6f8fa; border:none; border-radius:6px;">1. [Step] → verify: [check]
2. [Step] → verify: [check]
3. [Step] → verify: [check]</pre>
<p style="margin:0;">Strong success criteria let you loop independently. Weak criteria ("make it work") require constant clarification.</p>
}}

{{마크다운비교
|제목=⑦ 맺음말
|문법=구분선(---) · 굵게
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;">---

**These guidelines are working if:** fewer unnecessary changes in diffs, fewer rewrites due to overcomplication, and clarifying questions come before implementation rather than after mistakes.</pre>
|결과=<hr style="border:none; border-top:2px solid #d0d7de; margin:0 0 12px 0;">
<p style="margin:0;"><strong>These guidelines are working if:</strong> fewer unnecessary changes in diffs, fewer rewrites due to overcomplication, and clarifying questions come before implementation rather than after mistakes.</p>
}}

----
== 실습: 우리 팀 README.md 초안 쓰기 ==
<div style="padding:14px 16px; border-left:4px solid #1d4ed8; background:#eff6ff; margin:0 0 16px 0;">
<strong>💡 README.md란?</strong><br>
깃허브 저장소에 들어갔을 때 가장 먼저 보이는 소개 문서입니다. 우리 팀 프로젝트가 <strong>무엇을, 어떤 데이터로, 어떻게</strong> 만드는지 처음 보는 사람에게 설명합니다.
</div>
<div style="display:flex; align-items:flex-start; margin:0 0 8px 0;"><span style="flex:0 0 26px; height:26px; line-height:26px; border-radius:50%; background:#dc2626; color:#fff; text-align:center; font-weight:700; margin-right:10px;">1</span><div>아래 예시에서 왼쪽 원문의 기호가 오른쪽에서 어떻게 바뀌는지 확인합니다.</div></div>
<div style="display:flex; align-items:flex-start; margin:0 0 8px 0;"><span style="flex:0 0 26px; height:26px; line-height:26px; border-radius:50%; background:#dc2626; color:#fff; text-align:center; font-weight:700; margin-right:10px;">2</span><div>맨 아래 <strong>빈 틀</strong>을 복사해 마크다운 편집기(깃허브 웹 편집기 등)에 붙여 넣고, 팀 프로젝트 내용으로 채웁니다.</div></div>
<div style="display:flex; align-items:flex-start; margin:0 0 20px 0;"><span style="flex:0 0 26px; height:26px; line-height:26px; border-radius:50%; background:#dc2626; color:#fff; text-align:center; font-weight:700; margin-right:10px;">3</span><div>미리보기(Preview)로 결과를 확인하고, <strong>자가점검</strong> 항목을 모두 통과하는지 살펴봅니다.</div></div>

{{마크다운비교
|제목=예시: 가상의 팀 README
|문법=제목 · 굵게 · 목록 · 링크 · 표 · 체크리스트
|원문=<pre style="margin:0; padding:10px; white-space:pre-wrap; word-break:break-word; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0;"># 서원지기: 조선 서원 배향 인물 지식그래프

## 1. 프로젝트 소개
우리 팀은 **조선시대 서원 기록**을 바탕으로 서원과 배향 인물, 학맥의 관계를 지식그래프로 구축합니다.

## 2. 팀원
- 김가람 (사학과) — 데이터 수집
- 이나래 (국어국문학과) — 그래프 설계
- 박다온 (철학과) — 시각화·해석

## 3. 데이터 출처
- [한국학자료센터](https://kostma.aks.ac.kr)

## 4. 그래프 설계
| 노드 | 주요 속성 |
|---|---|
| Person | name, birth, death |
| Seowon | name, region |

## 5. 진행 상황
- [x] 데이터셋 선정
- [ ] 노드·관계 설계
- [ ] 중간발표 준비</pre>
|결과=<div style="font-size:1.6em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 12px 0;">서원지기: 조선 서원 배향 인물 지식그래프</div>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">1. 프로젝트 소개</div>
<p style="margin:0 0 12px 0;">우리 팀은 <strong>조선시대 서원 기록</strong>을 바탕으로 서원과 배향 인물, 학맥의 관계를 지식그래프로 구축합니다.</p>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">2. 팀원</div>
<ul style="margin:0 0 12px 0;">
<li>김가람 (사학과) — 데이터 수집</li>
<li>이나래 (국어국문학과) — 그래프 설계</li>
<li>박다온 (철학과) — 시각화·해석</li>
</ul>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">3. 데이터 출처</div>
<ul style="margin:0 0 12px 0;">
<li><span style="color:#1d4ed8; text-decoration:underline;">한국학자료센터</span></li>
</ul>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">4. 그래프 설계</div>
<table class="plan" style="width:100%; border-collapse:collapse; margin:0 0 12px 0;">
<tr><th style="border:1px solid #d0d7de; padding:4px 8px; background:#f6f8fa; text-align:left;">노드</th><th style="border:1px solid #d0d7de; padding:4px 8px; background:#f6f8fa; text-align:left;">주요 속성</th></tr>
<tr><td style="border:1px solid #d0d7de; padding:4px 8px;">Person</td><td style="border:1px solid #d0d7de; padding:4px 8px;">name, birth, death</td></tr>
<tr><td style="border:1px solid #d0d7de; padding:4px 8px;">Seowon</td><td style="border:1px solid #d0d7de; padding:4px 8px;">name, region</td></tr>
</table>
<div style="font-size:1.3em; font-weight:700; line-height:1.3; padding-bottom:4px; border-bottom:1px solid #d0d7de; margin:0 0 8px 0;">5. 진행 상황</div>
<div style="margin:0 0 4px 0;">☑ 데이터셋 선정</div>
<div style="margin:0 0 4px 0;">☐ 노드·관계 설계</div>
<div style="margin:0;">☐ 중간발표 준비</div>
}}

=== 빈 틀 (복사해서 사용) ===
<pre style="white-space:pre-wrap; font-size:13px; line-height:1.5; background:#f8fafc; border:1px solid #e2e8f0; padding:12px;"># (팀 이름): (프로젝트 제목)

## 1. 프로젝트 소개
우리 팀은 **(데이터셋 이름)**을 바탕으로 (무엇과 무엇의 관계)를 지식그래프로 구축합니다.

## 2. 팀원
- (이름) (학과) — (역할)
- (이름) (학과) — (역할)
- (이름) (학과) — (역할)

## 3. 데이터 출처
- [(출처 이름)]((출처 주소))

## 4. 그래프 설계
| 노드 | 주요 속성 |
|---|---|
| (노드 이름) | (속성1), (속성2) |

## 5. 진행 상황
- [ ] 데이터셋 선정
- [ ] 노드·관계 설계
- [ ] 중간발표 준비</pre>

<div style="padding:14px 16px; border:1px solid #cbd5e1; background:#f8fafc; margin:16px 0 0 0;">
<strong>✅ 자가점검</strong>
* 제목(#, ##) 뒤에 한 칸을 띄웠는가?
* 미리보기에서 표가 칸으로 나뉘어 보이는가? (둘째 줄 <code>|---|---|</code> 확인)
* 데이터 출처 링크를 눌렀을 때 실제 페이지가 열리는가?
* 팀원 역할이 실제 분담과 일치하는가?
* 처음 보는 사람이 이 문서만 읽고 프로젝트를 이해할 수 있는가?
</div>

마크다운연습

2026-10-23T16:14:48Z

Kimseoyun:

2026-09-16T03:02:33Z

Kimseoyun:

강수이.lst

2026-09-16T03:02:09Z

Kimseoyun:

2026 AppliedDH(수)

2026-09-15T13:23:57Z

Kimseoyun:

<div style="font-family: 'Noto Sans KR', sans-serif; max-width: 1000px; margin: 0 auto; color: #333;">


<div style="border-bottom: 3px solid #1d4e89; padding-bottom: 10px; margin-bottom: 30px;">
<h1 style="color: #1d4e89; margin: 0; font-size: 2.2em; border: none; border-bottom: none;">💡 자기소개 </h1>
<p style="margin: 5px 0 0 0; color: #666; font-size: 1.1em;">Introducing</p>
</div>


<div style="background-color: #fff8e1; border: 1px solid #ffe0b2; padding: 20px; border-radius: 8px; margin-bottom: 40px;">
<h3 style="margin-top: 0; color: #f57f17; border: none;">📝 자기소개 작성 방법</h3>
<ol style="margin-bottom: 0; line-height: 1.6; padding-left: 20px;">
<li>[https://wikidocs.net/book/20100 2026 디지털인문학 응용] 수업 문서입니다.
<li>먼저 계정을 만드세요.(실명으로 가입, 비밀번호는 학번 추천) </li>
<li>이제 검색 후 없는 페이지를 새로 만드실 수 있습니다.</li>
<li>'변경사항 저장'을 클릭한 후에는 수정 기록이 남으니, '미리보기'에서 확인 후 '이 문서 주시하기'를 해제하고 저장해 주세요</li>
<li>2026 AppliedDH 위키에 자신의 이름을 클릭해서 머리말에 <strong>[[사용자:이름]]</strong> 형식으로 새 문서를 만드세요.</li>
<li>김서윤(예시)가 있으니 [편집]으로 들어간 후, 그대로 복사해서 자유롭게 활용하세요.</li>
</ol>
</div>


<div style="margin-bottom: 50px; width: 100%;">
<h3 style="color: #1d4e89; border-left: 4px solid #1d4e89; padding-left: 10px; margin-bottom: 25px; border-bottom: none;">👥 Student List</h3>

<div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; width: 100%;">
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:강수이|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">강수이</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:이지환|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">이지환</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:김민섭|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김민섭</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:김민식|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김민식</span>]]</div>

<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:김나현|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김나현</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:윤지원|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">윤지원</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:강보민|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">강보민</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:장소희|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">장소희</span>]]</div>

<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:장해윤|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">장해윤</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:우서윤|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">우서윤</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:김서윤B|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김서윤B</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:이정욱|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">이정욱</span>]]</div>

<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:장채원|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">장채원</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:오은호|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">오은호</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[User:김서윤|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김서윤(예시)</span>]]</div>

</div>
</div>


<div style="border-bottom: 3px solid #1d4e89; padding-bottom: 10px; margin-bottom: 30px;">
<h1 style="color: #1d4e89; margin: 0; font-size: 2.2em; border: none; border-bottom: none;">💡 학생 프로젝트 </h1>
<p style="margin: 5px 0 0 0; color: #666; font-size: 1.1em;">Student Projects Archive</p>
</div>


<div style="background-color: #fff8e1; border: 1px solid #ffe0b2; padding: 20px; border-radius: 8px; margin-bottom: 40px;">
<h3 style="margin-top: 0; color: #f57f17; border: none;">📝 프로젝트 등록 방법</h3>
<ol style="margin-bottom: 0; line-height: 1.6; padding-left: 20px;">
<li>[[광주 오월길 사례|광주인문도시플랫폼의 오월길 사례]]를 참고합니다.</li>
<li>위키에서 <strong>[[아카이브:팀명]]</strong> 형식으로 새 문서를 만드세요.</li>
<li>프로젝트 소개, 연구 방법, 시각화 결과물 등을 자유롭게 작성하세요.</li>
<li>작성이 완료되면 문서 아래 분류에 팀명을 추가해 주세요.</li>
</ol>
</div>

<div style="margin-bottom: 50px;">
<h3 style="color: #1d4e89; border-left: 4px solid #1d4e89; padding-left: 10px; margin-bottom: 20px; border-bottom: none;">🏆 2026-2학기 결과물</h3>


<div style="margin-bottom: 50px; width: 100%;">
<h3 style="color: #1d4e89; border-left: 4px solid #1d4e89; padding-left: 10px; margin-bottom: 25px; border-bottom: none;">👥 lst 파일 </h3>

<div style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; width: 100%;">
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[강수이.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">강수이.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[이지환.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">이지환.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[김민섭.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김민섭.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[김민식.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김민식.lst</span>]]</div>

<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[김나현.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김나현.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[윤지원.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">윤지원.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[강보민.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">강보민.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[장소희.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">장소희.lst</span>]]</div>

<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[장해윤.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">장해윤.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[우서윤.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">우서윤.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[김서윤.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">김서윤.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[이정욱.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">이정욱.lst</span>]]</div>

<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[장채원.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">장채원.lst</span>]]</div>
<div style="border: 1px solid #ccc; border-radius: 6px; padding: 15px 10px; background-color: white; text-align: center; box-shadow: 1px 1px 3px rgba(0,0,0,0.05);">[[오은호.lst|<span style="color:#1d4e89; font-weight:bold; font-size: 1.1em;">오은호.lst</span>]]</div>

</div>
</div>

<div style="margin-top: 40px; padding-top: 20px; border-top: 1px solid #eee;">
<span style="font-weight: bold; color: #555; margin-right: 10px; vertical-align: middle;">🏷️ Tags:</span><span style="display: inline-block; border: 1px solid #cbd5e0; border-radius: 20px; padding: 4px 12px; margin-right: 5px; margin-bottom: 5px; background-color: white;">[[:분류:KU|<span style="color: #475569; font-size: 0.9em;">KU</span>]]</span><span style="display: inline-block; border: 1px solid #cbd5e0; border-radius: 20px; padding: 4px 12px; margin-right: 5px; margin-bottom: 5px; background-color: white;">[[:분류:2026|<span style="color: #475569; font-size: 0.9em;">2026</span>]]</span><span style="display: inline-block; border: 1px solid #cbd5e0; border-radius: 20px; padding: 4px 12px; margin-right: 5px; margin-bottom: 5px; background-color: white;">[[:분류:AppliedDH|<span style="color: #475569; font-size: 0.9em;">AppliedDH</span>]]</span><span style="display: inline-block; border: 1px solid #cbd5e0; border-radius: 20px; padding: 4px 12px; margin-right: 5px; margin-bottom: 5px; background-color: white;">[[:분류:Projects|<span style="color: #475569; font-size: 0.9em;">Projects</span>]]</span>
</div>

</div>

<div style="height: 50px;"></div>
__NOTOC__
__NOEDITSECTION__