yunkoo.dev

MDX Component

FileTree

폴더 구조를 설명할 때 사용합니다.

FileTree

폴더 구조를 설명할 때 사용합니다.

들여쓰기는 code 문자열 안에 공백으로 표현합니다. 폴더 구조를 짧게 보여줄 때 사용합니다.

Preview

posts
content-source   └─ posts      └─ building-my-blog-with-nextjs-mdx.mdx

MDX

<FileTree  title="posts"  size="sm"  code="content-source/|  posts/|    building-my-blog-with-nextjs-mdx.mdx"/>

More Examples

앱 라우트 구조

design routes
src/app/(site)   └─ design      ├─ page.tsx      └─ mdx/[slug]/page.tsx

MDX

<FileTree  title="design routes"  code="src/app/(site)/|  design/|    page.tsx|    mdx/[slug]/page.tsx"/>