[Gatsby.js] Gatsby Starter Ghostテンプレートを使ったセットアップ

この記事では、Gatsby Starter Ghostテンプレートを使用して、Markdown形式でGatsbyサイトに新しい記事を追加する手順を解説します。Gatsby Starter Ghostは、Ghost CMS（コンテンツ管理システム）を使用して記事を管理し、Gatsbyを使用してサイトをビルドするためのスターターテンプレートです。以下に、Markdownで記事を追加する手順を示します。

Gatsby Starter Ghostテンプレートのセットアップ

最初に、Gatsby Starter Ghostテンプレートをセットアップする必要があります。以下の手順に従って、テンプレートをクローンし、依存関係をインストールします。

プロジェクト用の新しいディレクトリを作成します。

mkdir my-gatsby-site
cd my-gatsby-site

Gatsby Starter Ghostテンプレートをクローンします。

git clone https://github.com/TryGhost/gatsby-starter-ghost.git

ディレクトリに移動し、依存関係をインストールします。

cd gatsby-starter-ghost
npm install

プロジェクトを開始します。

gatsby develop

これにより、Gatsbyサイトが http://localhost:8000 で起動します。

新しい記事の追加

Gatsby Starter Ghostテンプレートでは、Markdown形式で記事を追加することができます。以下の手順で新しい記事を作成しましょう。

プロジェクトのルートディレクトリに移動します。

content/posts ディレクトリ内に、新しいMarkdownファイルを作成します。

cd content/posts
touch my-new-post.md

作成したMarkdownファイル (my-new-post.md) をテキストエディタで開きます。

Markdownファイルに記事の内容を記述します。例えば、以下のような形式で記事を記述できます。

---
title: "My New Post"
date: "2023-05-31"
description: "This is a sample post."
---

# Heading 1

This is the content of my new post.

## Heading 2

More content goes here.

記事のメタデータ（title、date、descriptionなど）を適切に編集します。

記事のコンテンツをMarkdown形式で書きます。必要に応じて、見出し、段落、リスト、画像などの要素を追加します。

記事の保存と終了を行います。

Gatsbyサイトの更新

新しい記事が追加されたら、Gatsbyサイトを更新して変更を反映させる必要があります。

ターミナルで、Gatsbyプロジェクトのディレクトリに移動します。

サイトをビルドします。

gatsby build

ビルドが完了すると、生成された静的ファイルをWebサーバーにデプロイすることができます。 以上で、Gatsby Starter Ghostテンプレートを使用してMarkdown形式で記事を追加する手順が完了しました。これで、Gatsbyサイトに新しいコンテンツを追加できるようになりました。

以上が、Gatsby Starter Ghostテンプレートを使用してMarkdownで記事を追加する手順の解説です。これらの手順に従うことで、Gatsbyサイトに新しい記事を追加できるでしょう。お問い合わせがあれば、お気軽にお聞きください。