Dockerコンテナ内でzenn執筆環境を作る

イントロダクション

今回はローカル環境でzennを執筆するための環境をDockerを使用しコンテナ上に構築します。
つまりnode.jsのインストールされたコンテナを用意し、そこにzenn-cliをインストールする流れになります。

経緯

最近新しいMacBookを買いそちらの設定を行っていました。それまでに使っていたMacBookは初めてのMacBookだったことや初めてのプログラミング機だったことなどあり、開発環境がグチャグチャで手をつけたくなくなるような状態でした。

当時は仮想化の存在を知らなかったのでどうしようもありませんでしたが、今はDockerを知っているのでDockerである程度簡単に環境構築ができる物はDockerで行ってしまい、可能なかぎりマシンそのものには環境を作らないようにしようと思っています。

ローカル環境でzennを執筆するためのツールであるzenn-cliのインストールにはnode.jsが必要になります。node.jsをマシンそのものにインストールしなくていいようにDockerコンテナ内にインストールしていこうと思います。

やり方

docker-compose.ymlの作成

まずは作業ディレクトリを作ります。私はいつもmyProjectというディレクトリに作業ディレクトリを作成するのでそこに node-container という名前でディレクトリを作ります。
そこにdocker-compose.ymlを作成します。

docker-compose.yml

version: '3'

services:
  app:
    image: node:14.15.1
    container_name: node
    tty: true
    volumes:
      - ./app:/src
    working_dir: "/src"
    ports:
      - "8000:8000"

zenn-cliのインストール

一度コンテナを立ち上げます。

$ docker-compose up

ちゃんとコンテナが立ち上がることを確認したらコンテナ内に入りzenn-cliをインストールします。

$ docker-compose exec app bash
$ npm install zenn-cli

イメージデータのアップデート

インストールした内容をイメージに反映させ、永続化するためにイメージをアップデートします。

myProject % docker ps
CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS               NAMES
89c18d43ed12        node:14.15.1        "docker-entrypoint.s…"   11 minutes ago      Up 9 minutes                            node
myProject % docker commit 89c18d43ed12 node:14.15.1     
sha256:cd2235978fc981b84752c260842c76d8f5ab4e6f1f1306e10f10b35a17e0fe26

githubからこれまでの執筆データの取得

githubからこれまでに執筆したデータを取得します。

$ docker-compose exec app bash
$ cd app
$ git clone https://github.com/*******/zenn-content.git

感想

割と簡単にできました。せっかくメモリもストレージもマシマシにしたのでこれからも環境構築はできるだけコンテナ内でやっていこうと思います。