Component Library

Fern | Display code snippets using the CodeBlock component

The CodeBlock component is used when you want to display a code snippet.

CodeBlock Props:

  • title: string
  • language: a string representing the language of the code snippet

Single CodeBlock

This would look like:

1<CodeBlock title="Node.js SDK">
2```bash
3$ npm install --save @fern-api/node-sdk
4```
5</CodeBlock>
Node.js SDK
$$ npm install --save @fern-api/node-sdk

Multiple CodeBlocks

If you’d like to have tabs to show multiple CodeBlocks at a time, you can use the CodeBlocks component.

This would look like:

1<CodeBlocks>
2    <CodeBlock title="Install the Fern CLI">
3    ```bash
4    $ npm install fern-api
5    ```
6    </CodeBlock>
7    <CodeBlock title = "Global install">
8    ```bash
9    $ npm install -global fern-api
10    ```
11    </CodeBlock>
12</CodeBlocks>
$$ npm install fern-api
Built with