블로그 기능 데모 — 수식, 다이어그램, 코드 복사

· 4분 읽기 · 수정

이 글은 블로그에 추가된 여러 기능을 한 번에 확인할 수 있는 데모 포스트입니다. 코드 복사, 수식, 다이어그램, 인쇄 등이 정상 작동하는지 확인해 보세요.

LaTeX 수식

인라인 수식은 $E = mc^2$처럼 달러 하나로 감싸고, 블록 수식은 아래처럼 작성합니다.

∫−∞∞e−x2dx=π\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}

이차방정식의 근의 공식도 표현할 수 있습니다:

x=−b±b2−4ac2ax = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}

Mermaid 다이어그램

아래는 Mermaid로 작성한 간단한 플로우차트입니다. 다크 모드에서도 테마에 맞게 표시됩니다.

flowchart LR
    A[글 작성] --> B[마크다운]
    B --> C[빌드]
    C --> D[배포]
    D --> E[독자]

시퀀스 다이어그램 예시:

sequenceDiagram
    participant 글쓴이
    participant 블로그
    participant 독자
    글쓴이->>블로그: 글 게시
    블로그->>독자: RSS/검색
    독자->>블로그: 글 읽기

코드 블록과 복사 버튼

코드 블록 우측 상단의 복사 버튼을 클릭하면 전체 코드가 클립보드에 복사됩니다.

// 예시: 간단한 함수
function greet(name) {
  return `안녕하세요, ${name}님!`;
}
console.log(greet('방문자'));
# 빌드 및 미리보기
npm run build
npm run preview

Embeds (유튜브, X)

마크다운에 유튜브 또는 X(트위터) URL만 단독으로 적으면 자동으로 플레이어/트윗 카드로 임베드됩니다.

인쇄 기능

Ctrl+P(Windows) 또는 Cmd+P(Mac)로 인쇄 대화상자를 열면, 네비게이션·광고·댓글 등이 숨겨지고 제목과 본문만 출력됩니다. 긴 글을 PDF로 저장하거나 종이에 출력할 때 유용합니다.

수정 일자

이 글의 frontmatter에 updatedDate가 설정되어 있어, 상단 메타 정보에 수정 2025-02-11이 표시됩니다.