콘텐츠 및 차트 서식 지정

Atoms에서 Markdown으로 텍스트 서식을 지정하고 인터랙티브 Mermaid 다이어그램을 렌더링하는 방법을 알아보세요.

서식이 적용된 Markdown 콘텐츠 표시

Atoms는 채팅 응답, 문서, 렌더링된 보기에서 Markdown 서식을 기본적으로 지원합니다.

지원되는 Markdown 요소

• 헤더: 구조화된 섹션 제목에는 #, ##, 또는 ###를 사용하세요.
• 강조: **bold** 또는 *italic* 텍스트를 사용하세요.
• 목록: 글머리 기호 및 번호 매기기 목록에는 - 또는 1.을 사용하세요.
• 코드 블록: 코드 스니펫은 언어 구문 강조 표시와 함께 삼중 백틱 ()으로 감싸세요.

서식이 지정된 출력을 요청하려면 AI 에이전트에게 다음과 같이 지시하세요:

• "부제목과 글머리 기호가 포함된 명확한 Markdown 형식으로 응답을 작성해 주세요."

---

Mermaid 차트 표시 및 렌더링

Atoms는 Mermaid.js를 사용하여 플로우차트, 시퀀스 다이어그램, 아키텍처 맵 렌더링을 지원합니다.

Mermaid 차트 생성 방법

AI 에이전트에게 Mermaid 다이어그램을 생성하도록 프롬프트를 입력하세요:

• "사용자 인증 라이프사이클을 보여주는 Mermaid 플로우차트를 생성해 주세요."

에이전트는 표준 Mermaid 코드 블록을 출력합니다:

mermaid graph TD; A[User Submits Login] --> B{Valid Credentials?}; B -- Yes --> C[Issue JWT 토큰 & Redirect]; B -- No --> D[Show Error Message];

Atoms는 이 블록을 자동으로 구문 분석하고 보기에서 인터랙티브한 시각적 다이어그램으로 렌더링합니다.