OJAPP BLOG KIT · DOWNLOAD
自分のブログを、
ここから始めよう。
Blog Kitをダウンロードして、Markdownで記事を書く。
ビルドしたファイルを公開するだけで、自分のブログが完成します。
必要なもの:Node.js / テキストエディター / 公開先(Cloudflare Pagesなど)
QUICK START
公開まで、4ステップ。
コマンドを使うのは最初の準備とビルドだけ。記事は普通のMarkdownファイルで管理できます。
Node.jsを準備してZIPを展開
Node.js公式サイト ↗からLTS版をインストール。Blog KitのZIPを解凍し、展開したフォルダをVS Codeなどで開きます。
site.json を設定
ブログのタイトル、公開URL、言語などを自分のサイトに合わせて変更します。公開URLは実際の配置先に合わせて設定してください。
{
"title": "My Blog",
"url": "https://example.com/",
"lang": "ja"
}※ 上記は主要項目の例です。既存のsite.jsonを丸ごと置き換えず、必要な値を編集してください。
インストールしてビルド
展開したBlog Kitのルートフォルダで、ターミナルを開いて実行します。
npm install
npm run build完了すると、公開用の静的ファイルが dist/ に生成されます。
Cloudflare Pagesで公開
Cloudflareダッシュボード ↗からWorkers & PagesのPagesプロジェクトを作成し、ドラッグ&ドロップ方式で dist/ フォルダをアップロード。発行されたURLで表示を確認します。
独自ドメインは公開後に追加できます。Cloudflareの画面表記や操作手順は変更される場合があります。
WRITE & REBUILD
公開後も、やることはシンプル。
記事を書く
content/ にMarkdownファイルを追加。記事のタイトルや公開日などは articles.json で設定できます。
再ビルドする
記事を更新したら npm run build。記事一覧やRSS、サイトマップなども再生成します。
もう一度公開
更新された dist/ を再アップロード。GitHub連携による自動公開へ切り替えることもできます。
CHOOSE YOUR WORKFLOW
ZIPでも、GitHubでも。
LOCAL FIRST
ZIPから始める
まずは自分のPCで作って、完成した dist/ をアップロード。構成を確認しながら進めたい人向け。
GITHUB WORKFLOW
テンプレートから始める
GitHubに自分のリポジトリを作成。GitHub ActionsやCloudflare Pagesとの連携で公開を自動化できます。
GitHubテンプレートを見る ↗