【2026年版】ローカルホストでDecap CMS（旧Netlify CMS）をテストする

🔁 2026年リライト版 この記事は2020年4月に公開した「ローカルホストでGitHubの環境を汚さずにNetlify CMSをテストする」を、2026年時点の Decap CMS（2023年に Netlify CMS がリネーム・フォーク）前提で書き換えたものです。

2026年の状況 — Netlify CMS → Decap CMS

Netlify CMS は、2023年2月に元運営元 Netlify が開発撤退し、コミュニティで Decap CMS としてフォーク・改名されました。パッケージ名も netlify-cms から decap-cms へ変わっています。ローカルで動かすためのプロキシサーバも netlify-cms-proxy-server から decap-server に名称が変わりました。

本記事では 2026年4月時点の Decap CMS 3.x 前提で、ローカルホストでの動作確認方法を解説します。

ローカルテストが必要な理由（2020年と変わらず）

Decap CMS は git-gateway バックエンドで GitHub / GitLab / Bitbucket のリポジトリに直接コミットします。コレクション設定やカスタムプレビューを開発中にいじると、毎回リポジトリにテストコミットが飛んでしまう ため、履歴を汚したくない場合はローカルで完結させたいところです。そのための仕組みが Local Backend と Decap Server です。

セットアップ

1. `config.yml` に Local Backend を有効化

static/admin/config.yml:

local_backend: true
backend:
  name: git-gateway
  branch: main  # 2020年当時は master が既定だったが現在は main

local_backend: true を追加するだけで、Decap CMS はローカルの http://localhost:8081 にあるプロキシサーバ経由で動くようになります。本番デプロイ時もこの行を残したままで問題ありません（Local Backend はローカルで Decap Server が動いているときだけ有効になります）。

2. Decap Server をインストール

❯ npm install -D decap-server

2020年当時の netlify-cms-proxy-server は現在アーカイブされており、代替パッケージが decap-server です。

3. 起動

2つのプロセスを起動します。

# Hugo の開発サーバ
❯ hugo server

# もう1つのターミナルで Decap Server
❯ npx decap-server

ブラウザで以下にアクセスします。

http://127.0.0.1:1313/admin/

Decap CMS の画面が表示されたら、右上のログインボタンを押すだけ（認証はスキップされ、ダッシュボードに入れます）。以降、記事の作成・編集・画像アップロードはすべてローカルで完結し、Git リポジトリには反映されません。

動作確認時のチェックリスト

ブラウザのコンソールに local_backend: true の確認ログが出ているか
ポート 8081 が Decap Server で使用されているか（他のツールと衝突する場合は --port オプションで変更可能）
記事作成後、content/ 配下にファイルが生成されているか
画像アップロード後、media_folder で指定したパスに画像が保存されているか

プロキシサーバのカスタマイズ

2020年当時は Beta 扱いでしたが、2026年現在は安定機能として提供されています。package.json の scripts に入れておくと便利です。

{
  "scripts": {
    "dev": "hugo server",
    "cms": "decap-server",
    "start": "npm-run-all --parallel dev cms"
  },
  "devDependencies": {
    "decap-server": "^3.x",
    "npm-run-all": "^4.x"
  }
}

npm start の1コマンドで Hugo と Decap Server の両方が起動するようになります。