Contribution · OFFAIR

문서를 추가·수정하는 방법과, MDX에서 바로 쓸 수 있는 컴포넌트 목록입니다.

수정 모드 (가장 쉬운 방법)#

개발 서버로 실행하면 브라우저에서 바로 문서를 편집할 수 있는 수정 모드가 켜집니다.

npm run dev

개발 환경에서는 다음이 나타납니다.

수정 모드에서 할 수 있는 것

저장하면 content/ 의 실제 .mdx 파일에 그대로 기록됩니다.

주의

수정 모드는 개발 환경에서만 동작합니다. 배포된 사이트에서는 /edit 이 열리지 않습니다(404).

수정 모드를 쓰지 않고 직접 파일을 만들어도 됩니다. content/docs/ 아래에 .mdx 파일을 하나 만들면 사이드바·목차·검색이 자동으로 갱신됩니다.

---
title: 문서 제목
description: 사이드바·검색에 쓰이는 한 줄 설명
category: 영상 송출    # 사이드바 그룹
order: 2              # 그룹 내 순서
---
 
여기에 내용을 마크다운으로 작성합니다.

TIP

카테고리 순서는 content/sidebar.json 에서 관리합니다(수정 모드의 사이드바 드래그가 이 파일을 자동으로 갱신합니다). 폴더로 묶어도 됩니다 — 예) content/docs/audio/mixer.mdx → /docs/audio/mixer

별도 import 없이 MDX 안에서 바로 사용할 수 있습니다. (수정 모드 에디터에서는 / 슬래시 메뉴로 골라 넣을 수 있습니다.)

<Callout type="tip" title="선택">내용</Callout>

type 은 note · info · tip · warn · danger 중 하나입니다.

<Steps>
  <Step title="첫 번째">설명</Step>
  <Step title="두 번째">설명</Step>
</Steps>

<Figure src="/assets/onair/00-main.webp" alt="설명" caption="캡션" />

클릭하면 확대됩니다. 이미지는 public/ 폴더에 둡니다.

<CardGrid>
  <Card href="/docs/intro" title="시작하기">설명</Card>
</CardGrid>

<Kbd>Ctrl</Kbd> + <Kbd>C</Kbd> 그리고 <Badge>LIVE</Badge>

표는 GFM 문법을 그대로 쓰고, 코드 펜스(```)에 언어를 적으면 문법 강조 + 복사 버튼이 자동으로 붙습니다.