Ubuntu Weekly Recipe

第709回 CodiMDでMarkdownをウェブブラウザーから共同編集する

この記事を読むのに必要な時間:およそ 5 分

ミーティングで議論した内容は,議事録として残すことが重要です。人間は1時間ぐらい経つと半分ぐらいしか思い出せないという話もあります。言った・言わないの話をする時間を考えたら,最初から議事録をとっておくのが重要でしょう。今回はオンラインミーティングの議事録に有用な,ウェブブラウザーでMarkdownフォーマットのテキストを共同編集できるCodiMDを紹介します。

HackMDのFLOSS版である「CodiMD」

CodiMDはMarkdownをウェブブラウザーで編集し,共有できるサービスであるHackMDのFLOSS版という位置づけです。HackMDから一部の機能を削っただけで,基本的な機能は一通り揃っています。具体的にはアカウント認証・ゲストアクセス・HTML/PDFやPandoc経由の出力,スライドページ化などです。

いわゆる「ホワイトボード」だと第622回のSpacedeckでホワイトボードを共有するで紹介したSpacedeckが存在します。ただこれはどちらかというと図形を描く用途のツールで,ディスカッションで互いの考えを模式化する際には有用ではあるものの,議事録を書くには向きません。

議事録をとるとなると,誰かがテキストエディターの画面を共有して書くという方法もあるものの,議事録係が発言するとなるといろいろ大変です。もちろん「議事録係」専任として発言はしない人をミーティングに参加させるのは,本末転倒でしょう※1⁠。

※1
新人に主体的にプロジェクトの雰囲気を感じ取り,参加意識を持たせるために,議事録を書いてもらうという考え方はあるかもしれません。それでも議事録を書くのに精一杯で発言できなくなる状態がずっと続いてしまうのは,あまり良い傾向とは言えないでしょう。

そこで出てくるのが「共同編集する仕組み」です※2⁠。誰でも編集できるようにしておくことで,発言していない人でもフォローできるようになります。もちろん「誰が書く」かで「お見合い」になってしまう可能性もありますので,ある程度事前に決めごとが必要になるものの,一言伝えるだけで作業を引き渡せるのは非常に重要です。

※2
最近はオンラインミーティングが普通になってきたので,素直に録音してしまうという手もあります。また,自動で文字起こししてくれるサービスも増えてきました。

共同編集ツールと言えばEtherpadが古くから有名です。もともとはJava/Scalaで作られたプロプライエタリなソフトウェアだったのですがその後FLOSSとなります。さらにNode.jsで再実装されたetherpad-liteが登場し,現在ではそちらが主流となりJava版のEtherpadは開発終了しました※3⁠。

※3
Ubuntuでも半年に一度の開発者ミーティングをオンラインで開催していた頃は,オリジナルのほうのEtherpadを使っていたような記憶があります。DebianはDebConfでGobbyを使っていたようですが,最近は新しい方のEtherpadを(も?)使っているようです。

etherpad-liteとCodiMDに共同編集という観点で基本的な違いはありません。一番大きな違いは,etherpad-liteがMicrosoft Word/LibreOffice WriterっぽいUIなのに対して,CodiMDはMarkdownをメインに据えているところでしょうか。CodiMDのほうはMarkdown記法で記述した上でライブレンダリングによる表示もサポートしています。ちなみにCodiMDはehterpad-liteからのマイグレーションもサポートしています。

CodiMDのデプロイ

CodiMDはNode.jsベースのソフトウェアです。よってそのデプロイにはNode.js/npmに加えて,PostgreSQLもしくはMySQLのデータベースが必要になります。とは言うものの,本連載でここ最近紹介しているサービスの例に漏れず,CodiMDもDockerイメージが用意されており,それを使ってデプロイするのが一番簡単です。

まずはいつものように,Dockerとdocker-composeをインストールしておきます。次のようにUbuntuリポジトリのパッケージでも良いですし,Docker本家のバイナリでもかまいません。

$ sudo apt install -y docker.io docker-compose

次に本家が用意しているdocker-compose.ymlを用意しましょう。

$ sudo mkdir /etc/codimd && cd $_
$ sudo editor docker-compose.yml

今回は次のように記述します。

version: "3"
  services:
    database:
      image: postgres:11.6-alpine
      environment:
        - POSTGRES_USER=codimd
        - POSTGRES_PASSWORD=パスワード
        - POSTGRES_DB=codimd
      volumes:
        - "database-data:/var/lib/postgresql/data"
      restart: always
    codimd:
      image: hackmdio/hackmd:2.4.1-cjk
      environment:
        - CMD_DB_URL=postgres://codimd:パスワード@database/codimd
        - CMD_USECDN=false
      depends_on:
        - database
      ports:
        - "3000:3000"
      volumes:
        - upload-data:/home/hackmd/app/public/uploads
      restart: always
  volumes:
    database-data: {}
    upload-data: {}

最低限変更すべきなのは次の3箇所です。

  • databaseサービスのPostgreSQLのデータベースのパスワード
  • codimdサービスのCMD_DB_URLに含まれるパスワード(上と同じにする)
  • codimdサービスのimagehackmdio/hackmd:2.4.1からhackmdio/hackmd:2.4.1-cjkに変更する

パスワードはここではベタに書いてしまっていますが,.envファイルを用意してそこから環境変数として参照させても良いでしょう。

imageをcjk付きにすると,Source Han Sans(源ノ角)フォント付きのコンテナイメージが使われます。これは日本語文書をPDFに生成したいときに必要になります。PDF生成等を使わないのであれば,cjk無しのイメージのほうがサイズを小さくできます。

あとはインスタンスを立ち上げるだけです。

$ sudo docker-compose up -d

http://localhost:3000にアクセスすると,ログイン画面が表示されます。

図1 ⁠サインイン」ボタンでログインする。⁠履歴」で過去にアクセスした文書のリストを参照できる

図1

図2 メールアドレスとパスワードを入力し「登録」を選択するとアカウントが作成される

図2

図3 ログインが完了すると新規文書が作成される

図3

初期設定では誰でもアカウントを作れるようになっています。また,アカウントには「管理者」という概念は存在しないようです。

文書の編集画面は一般的なMarkdownエディターです。左にMarkdownを入力し,右にレンダリング結果が表示されます。

図4 適当なMarkdownファイルを入力した状態

図4

図5 画面上部の「?」をクリックするとチートシートが表示される

図5

もちろん日本語も問題なく使えます。画面左上にある「ペンアイコン」を選択すると編集画面のみの表示になり,⁠眼のアイコン」を選択するとレンダリング結果のみの表示になります。

文書を他の人も編集・閲覧できるようにするためには,このページのURLを共有してください。右上の「ONLINE」が編集・閲覧中の人数で,クリックするとメンバーリストが表示されます。メンバーリストの左にある色が,編集画面の各行の色に反映され,最後に誰が編集したかがわかるようになるというわけです。また編集時はカーソルの場所が他の人に見えるようになっています。

同じく右上の「公開する」を選択すると,公開用のURLが生成されます。ログインしていないユーザーに閲覧権限だけ与えたい場合は,このURLを渡すことになります。ただし既存の設定では,誰でも編集画面へと遷移できる状態になっているため,編集時のヘッダーが表示されるかどうかの違いぐらいしかありません。

SSL/TLSの利用も可能ではありますが,Nginxなどのリバースプロキシー側で実施することを推奨しています。公式ドキュメントにApache,Nginx,HAProxyの設定例が載っていますので,これをそのまま使うと良いでしょう。

バックアップやリカバリーは,docker-compose.ymlに書かれている2個のボリュームをバックアップ取れば事足ります。ただしdatabase-dataのほうはpg_dumpコマンドでダンプファイルを作ったほうが安全です。

著者プロフィール

柴田充也(しばたみつや)

Ubuntu Japanese Team Member株式会社 創夢所属。数年前にLaunchpad上でStellariumの翻訳をしたことがきっかけで,Ubuntuの翻訳にも関わるようになりました。