마크다운 뷰어 & 실시간 에디터
LaTeX 수학 공식, Mermaid 다이어그램, GFM 표, GitHub 스타일 알림(Alerts), 코드 구문 강조를 지원하는 고성능 브라우저 마크다운 도구입니다.
# 🚀 차세대 마크다운 뷰어 & 에디터
이 도구는 **100% 브라우저 메모리**에서 동작하며, LaTeX 수식, Mermaid 다이어그램, GFM 표, Diff 코드 강조, GitHub 알림, 이모지 단축코드 등을 즉시 렌더링합니다.
# 💡 지원 기능 요약
- [object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
# 📊 1. Mermaid 다이어그램 지원
마크다운 코드 블록에 ```mermaid 를 입력하면 다양한 다이어그램이 자동 렌더링됩니다.
# 📅 시퀀스 다이어그램 예시
# 📐 2. LaTeX 수식 (KaTeX 지원)
# 인라인 수식
유명한 아인슈타인의 질량-에너지 등가 공식은 이며, 오일러 공식은 입니다.
# 블록 수식
가우스 적분과 정규분포 확률밀도함수:
# 🔔 3. GitHub 스타일 알림 (Alerts / Callouts)
[!NOTE] 파일은 외부 서버로 전송되지 않으며 모든 연산은 사용자 브라우저에서 안전하게 수행됩니다.
[!TIP] 클립보드에 복사한 이미지를 에디터에 `Ctrl + V`로 붙여넣으면 Base64 이미지로 자동 변환되어 문서에 내장됩니다.
[!IMPORTANT] 상단 툴바의 **'Slide'** 버튼을 누르면 이 문서를 즉시 전체 화면 프레젠테이션 슬라이드로 발표할 수 있습니다.
[!WARNING] 브라우저 탭을 새로고침하기 전에 중요한 작성 내용은 **다운로드(.md)** 버튼으로 보관하세요.
# 💻 4. 코드 구문 강조 및 Diff 블록
--- a/src/parser.ts+++ b/src/parser.ts@@ -1,5 +1,6 @@- const version = "1.0.0";+ const version = "2.0.0";+ const enableMermaid = true; function initialize() {- console.log("Old init");+ console.log("Next-Gen Markdown Initialized!"); }
// TypeScript 예제
export function generateReport(title: string): { status: string } {
console.log(`Generating report: ${title}`);
return { status: "success" };
}
# 📋 5. GFM 표 (Table)
# 🏷️ 6. 단축키 및 서식 태그
- [object Object],[object Object],[object Object],[object Object]
마크다운 뷰어 및 에디터 사용 가이드
서버 업로드 없이 브라우저 메모리에서 안전하고 빠르게 마크다운을 편집하고 렌더링하세요.
💡 사용 방법 (단계별 안내)
- 직접 텍스트를 입력하거나 "Open File" 버튼으로 .md 파일을 불러옵니다.
- 상단 툴바에서 View / Edit / Split 모드를 선택하여 편리하게 작업합니다.
- 수식($$...$$), Mermaid 다이어그램, 코드 구문 강조 등 다양한 확장을 실시간 확인합니다.
- 작업 완료 후 .MD 다운로드, .HTML 내보내기, 클립보드 복사 또는 인쇄(PDF)를 진행합니다.
🔒 주요 특징 및 브라우저 처리 원리
LaTeX 수식 (KaTeX) & Mermaid 완벽 지원
인라인 및 블록 수식부터 플로우차트, 시퀀스, 간트차트 등 복잡한 다이어그램을 클라이언트에서 즉시 렌더링합니다.
100% 브라우저 메모리 안전 처리 (Zero Server Upload)
작성 중인 문서 데이터는 서버로 전송되지 않으며, 사용자의 브라우저 내부에서만 안전하게 처리 및 보관됩니다.
GitHub Flavored Markdown (GFM) 완벽 호환
테이블, 체크박스 목록, 취소선, GitHub Alert 콜아웃(Note, Tip, Warning 등)을 완벽 지원합니다.
다양한 내보내기 및 인쇄 최적화
마크다운 소스 및 단독 실행 가능한 HTML 파일 다운로드가 가능하며, 인쇄 시 본문 전용 레이아웃이 적용됩니다.
❓ 자주 묻는 질문 (FAQ)
Q. 작성 중인 마크다운 내용이 서버에 저장되거나 유출될 위험이 있나요?
A. 아닙니다. WebTools의 모든 처리는 사용자의 웹 브라우저 내부 메모리에서만 동작하므로 서버로 데이터가 일체 업로드되지 않아 기밀 문서도 안심하고 열람·편집할 수 있습니다.
Q. 수식(LaTeX)이나 Mermaid 다이어그램 문법은 어떻게 작성하나요?
A. 수식은 $...$(인라인) 또는 $$...$$(블록)으로 감싸며, 다이어그램은 ```mermaid 코드 블록 안에 표준 Mermaid 문법을 작성하시면 즉시 그래픽으로 렌더링됩니다. 상단 "Sample" 버튼을 누르시면 예제를 즉시 확인하실 수 있습니다.
Q. 작성한 문서를 PDF나 HTML 파일로 저장할 수 있나요?
A. 네, 상단 툴바의 ".HTML" 버튼을 누르면 스타일과 수식/하이라이트가 내장된 독립 실행 HTML로 다운로드되며, 인쇄 아이콘을 누른 후 "PDF로 저장"을 선택하시면 고품질 PDF로 출력할 수 있습니다.