Salah satu prinsip utama dalam pengembangan perangkat lunak adalah DRY (Don’t Repeat Yourself), yang juga berlaku untuk dokumentasi. Jika Anda menemukan diri Anda mengulangi konten yang sama di beberapa tempat, Anda harus membuat snippet kustom untuk menjaga konten Anda tetap sinkron.

​
Membuat snippet kustom

Pra-kondisi: Anda harus membuat file snippet Anda di direktorisnippets agar impor berfungsi.

Setiap halaman di direktorisnippets akan diperlakukan sebagai snippet dan tidak akan dirender menjadi halaman mandiri. Jika Anda ingin membuat halaman mandiri dari snippet, impor snippet ke file lain dan panggil sebagai komponen.

​
Ekspor default

  1. Tambahkan konten ke file snippet Anda yang ingin Anda gunakan kembali. Secara opsional, Anda dapat menambahkan variabel yang dapat diisi melalui props saat Anda mengimpor snippet. Dalam contoh ini, variabel kami adalah word.
snippets/my-snippet.mdx
Hello world! This is my content I want to reuse across pages.
  1. Impor snippet ke file tujuan Anda.
destination-file.mdx
---
title: My title
description: My Description
---

import MySnippet from '/snippets/path/to/my-snippet.mdx';

## Header

Lorem impsum dolor sit amet.

<MySnippet/>

​
Mengekspor dengan variabel

  1. Secara opsional, Anda dapat menambahkan variabel yang dapat diisi melalui props saat Anda mengimpor snippet. Dalam contoh ini, variabel kami adalah word.
snippets/my-snippet.mdx
My keyword of the day is {word}.
  1. Impor snippet ke file tujuan Anda dengan variabel. Properti akan diisi berdasarkan spesifikasi Anda.
destination-file.mdx
---
title: My title
description: My Description
---

import MySnippet from '/snippets/path/to/my-snippet.mdx';

## Header

Lorem impsum dolor sit amet.

<MySnippet word="bananas" />

​
Variabel yang dapat digunakan kembali

  1. Ekspor variabel dari file snippet Anda:
snippets/path/to/custom-variables.mdx
export const myName = 'my name';

export const myObject = { fruit: 'strawberries' };
  1. Impor snippet dari file tujuan Anda dan gunakan variabel:
destination-file.mdx
---
title: My title
description: My Description
---

import { myName, myObject } from '/snippets/path/to/custom-variables.mdx';

Hello, my name is {myName} and I like {myObject.fruit}.