마크다운 기능

문서는 사용자가 만날 수 있는 제품 접점 중 하나입니다. 적절하게 구성되고 쓰인 문서는 사용자가 제품을 빠르게 이해하는 데 도움을 줍니다. 우리의 목표는 여러분의 사용자가 가능한 한 빨리 필요한 정보를 찾고 이해할 수 있도록 도와주는 것입니다.

도큐사우루스 2는 여러분이 문서를 쉽게 작성할 수 있도록 최신의 도구를 사용하고 있습니다. 리액트 컴포넌트를 활용하거나 라이브 코딩 블록을 사용해 사용자가 코드 실행 결과를 바로 확인할 수 있도록 문서를 작성할 수 있습니다. 문서에서 벗어나지 않고 떠오른 아이디어를 코드로 확인해볼 수 있습니다. 이런 방식은 잠재적인 사용자에게 흥미를 주는 가장 효과적인 방법입니다.

이번 세션에서는 여러분이 문서 작성 시 든든한 도움이 될 수 있는 도구를 소개하려고 합니다. 예를 들면 이런 것입니다.

important

이번 세션에서는 기본으로 제공되는 도큐사우루스 콘텐츠 플러그인을 사용하고 있다고 가정합니다.

Standard features

마크다운은 가독성있는 문법을 사용해 정형화된 콘텐츠를 작성할 수 있습니다.

우리는 기본 마크다운 문법을 지원하고 있으며 MDX를 사용해 마크다운과 리액트 컴포넌트를 같이 해석하고 문서로 표현해줍니다.

### My Doc Section
Hello world message with some **bold** text, some _italic_ text and a [link](/)
![img alt](/img/docusaurus.png)

My Doc Section

Hello world message with some bold text, some italic text and a link

Quotes

Markdown quotes are beautifully styled:

> This is a quote

This is a quote

Details

Markdown can embed HTML elements, and details HTML elements are beautifully styled:

### Details element example
<details>  <summary>Toggle me!</summary>  <div>    <div>This is the detailed content</div>    <details>      <summary>        <div>Nested toggle!</div>        <div>Some surprise inside...</div>      </summary>      <div>        😲😲😲😲😲      </div>    </details>  </div></details>

Details element example

Toggle me!

This is the detailed content

Nested toggle!

Some surprise inside...

😲😲😲😲😲

note

In practice, those are not really HTML elements, but React JSX elements, which we'll cover next!