はじめに

Y’all !! レコチョクでWeb開発の担当しているH.Oです。

皆さんは社内ナレッジをどのように管理していますか？ Notion? Confluence? Git管理系のwiki??

しかしお金がかかったり、変な操作で壊れたりなどの苦い経験があると思います！ そんなあなたにおすすめしたいのがこちら

Docsifyについて

https://docsify.js.org ドキュメント静的ジェネレータになります。 似たようなサービスでは他にgitbookやSphinxなどがありますが、それらと比べ検索精度の良さ、軽さ、導入の簡単さなどがあげられる結果からこちらをドキュメント閲覧用としてすごくおすすめします

導入メリット・デメリット

メリット

• 検索精度が良い
• 導入が簡単
• サーバを立てなくても最新のドキュメントを気軽に閲覧できる
• Gitで管理ができる
• 見やすい（テーマが選択できる）
• 可愛い
• 廃止から移行する際markdownなので簡単にできる。
• 最終更新者がすぐわかる
• 可愛い

デメリット

• Markdownの学習コスト
• doctifyの拡張の学習コスト
• ローカルで編集して閲覧する場合Dockerを立ち上げる必要がある

ファイル構成

以下のような構成で作っていきます。

.
├── doctify
│   ├── docker
│   │   └── node
│   │       └── Dockerfile
│   ├── docs
│   │   └── index.html
│   │   └── .nojekyll
│   │   └── README.md
│   ├── compose.yml
│   └── README.md
│
.

導入手順

必要ファイル作成

前提としてgithubリポジトリがあるとします。

$ git clone https://github.co.jp/sample/example.git
$ cd example
$ touch compose.yml
$ mkdir -p docker/node
$ touch docker/node/Dockerfile

Docker環境作成

docsifyのローカル環境にはnodeが必要となります。

（1）compose.ymlの編集 以下を記載します

services:
  node:
    build:
      context: .
      dockerfile: ./docker/node/Dockerfile
    tty: true
    volumes:
      - type: bind
        source: "./docs"
        target: "/docs"
    ports:
      - 3000:3000
    #command: docsify serve .#ここは後ほどコメントインする。

（2）Dockerfileの編集

FROM node:24-alpine

WORKDIR /docs

LABEL description="A Dockerfile for build Docsify."

RUN npm install -g docsify-cli@latest

（3）コマンドでビルド開始 compose.ymlと同じ階層でコマンドを叩きます

$ docker compose up --build -d

（4）コンテナに入りパッケージ取得実行 nodeコンテナ内に入ります。

$ docker compose exec node ash

docsifyコマンドを実行し /docs配下にファイルを生成 ( Are you sure you want to rewrite it? (y/N)はyを入力→Enter押下)

$ docsify init .

サーバを立ち上げコマンド実行

$ docsify serve .

できたら以下にアクセスし、TOPページが出れば完了！！ http://localhost:3000/#/

（5）compose.ymlの編集 次回からコンテナ起動時に自動的にサーバを立ち上げたいので、以下コメントインする

services:
  node:
    build:
      context: .
      dockerfile: ./docker/node/Dockerfile
    # tty: true ←不要であれば削除
    volumes:
      - type: bind
        source: "./docs"
        target: "/docs"
    ports:
      - 3000:3000
    command: docsify serve . ←ここのコメントイン

（6）これにてdocsifyの導入は成功です！ おつかれさまでした！ このDocsifyをたくさん使用したり、導入してみちゃったりしてください！！