Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,16 @@ title: Custom React Components
subtitle: Add your own React components to enhance your docs
---

<Markdown src="/snippets/pro-plan.mdx"/>

You can extend Fern's built-in component library by adding your own custom React components.
This allows you to create unique, interactive elements that match your documentation needs.

<Note>Setting up custom react components is part of the pro plan.</Note>
<Note title="Defining a constant">
Don't use a React component to define a constant. Instead, consider using [reusable snippets](/docs/writing-content/reusable-markdown).
</Note>

## How does it work
## How does it work?

<Steps>
### Create a React component
Expand Down
Original file line number Diff line number Diff line change
@@ -1,17 +1,19 @@
---
title: Reusable Markdown
description: Reusable, custom markdown to keep content in sync. Edit once, update everywhere.
title: Reusable snippets
description: Reusable, custom markdown snippets to keep content in sync. Edit once, update everywhere.
---

Keep your documentation DRY (Don't Repeat Yourself) by defining a reusable snippet once, and then referencing it in multiple places. This way, you only need to update the snippet in one place to keep all references in sync.
Keep your documentation DRY (Don't Repeat Yourself) by defining a reusable Markdown snippet once, and then referencing it in multiple places. This way, you only need to update the snippet in one place to keep all references in sync.

Reusable snippets work well for constants (API limits, subscription prices, version numbers), repeated warnings or notes, and standardized formatting blocks.

## Create a reusable snippet

To use reusable snippets, start by creating a new folder in your `fern` project called `snippets`. Inside the `snippets` folder, create a new file for each snippet you want to define.
To use reusable snippets, start by creating a new folder in your `fern` project called `snippets`. Inside the `snippets` folder, create a new Markdown file for each snippet you want to define.

For example:

```bash
```bash {3, 6-8}
fern
└─ pages
└─ my-tutorial.mdx
Expand Down