スニペットを登録する

早速ページの実装、と行きたいところですが、 先にスニペットのデータの登録を行いたいと思います。

dataフォルダにsnippetsフォルダを追加する

このプロジェクトのデータ(MDX ファイル)の保管先はdataフォルダです。 dataフォルダ直下にはblogdocsフォルダがありますが、ここにsnippetsフォルダを追加します。

snippetsフォルダに MDX ファイルを追加する

snippetsフォルダを作成したら、適当なスニペットが書かれた MDX ファイルを追加してみましょう。 次のcomponent.mdxファイルをsnippets配下に作成してください。

data/snippets/component.mdx
# React Component

```tsx
type Props = {};

export const Component = (props: Props) => {
    return <></>;
};
```

まとめ

ここでは、dataフォルダにsnippetsフォルダを追加し、 最初のスニペットcomponent.mdxを登録しました。

次に行うことは、今回作成したcomponent.mdxを サイトのページに反映させることです。