【技術書典15】グループ横断で有志メンバーを集めて初となる合同誌を出版しました

こんにちは、GMOグローバルサイン・ホールディングスでPlayCanvasのPdMをしております津田@utautattaroです。普段はGMOインターネットグループのデベロッパーエキスパートとしても活動しており、事業推進と技術ブランディング向上の両軸をいつも頑張っています。

GMOインターネットグループ デベロッパーエキスパートとは

インターネット業界の発展に貢献するパートナー支援制度

GMOインターネットグループは、特定の専門分野における第一人者として業界の発展に寄与するとともに、GMOインターネットグループの技術力を牽引し、技術広報活動に貢献するパートナー(従業員)を支援する「エキスパート制度」を新設しました。この制度は、GMOインターネットグループの技術広報活動など、グループ内における開発者コミュニティの活性化やインターネット業界の発展に貢献する開発者(デベロッパー)を「デベロッパーエキスパート」に任命し、その活動を支援するものです。エキスパートに任命された開発者には、活動費として最大で年間100万円が支給されます。

今回はそのエキスパートの活動の一環で、グループ横断で技術書を出版し、技術書典15にて頒布をいたしました!今回は出した本の紹介とイベントの様子、またそもそもこの活動の立ち上げから共同執筆環境の構築などについて振り返って行きたいと思います。

完成したもの


「Good Morning #01」
GMOインターネットグループ エンジニア有志一同著

GMOインターネットグループから、GMOグローバルサイン・ホールディングス / GMOペパボ / GMOアドマーケティング / GMOリサーチのメンバーが筆を執り、それぞれの技術領域についてまとめたオムニバス形式の技術書となっています。

技術書典マーケットにて0円で電子版頒布しておりますので、ぜひダウンロードしてみてください。
また今回の執筆者を通してグループ各社本棚に寄贈させていただいております。ぜひ物理本も手にとって見てみてください。

イベント当日の様子

11/12に池袋サンシャインで行われた技術書典15オフライン会場にて、物理本の頒布を行いました。


当日は200冊刷って行きましたが、イベント終了3時間前には物理本はなくなってしまうほどの売れ行きでした!

初期構想

もともと自分が技術書としてのアウトプットに興味があったのでいつかは技術同人誌を発行してみたい思いがありました。Webやイベント登壇でのアウトプットが今は中心ですが、本はアーカイブ性が高いですし、技術書籍は未だに根強い人気があります。書き手としてもサラッと消費されていくWeb媒体よりも紙媒体に残してみたいという思いもあり、まずは同人誌出版を目指していました。

そういった背景もあり、このプロジェクトは私がエキスパート制度に立候補したときからやりたいこととしてリストアップしていました。結果として就任の際のプレゼンテーションでグループ各社の技術責任者の方から多くの賛同をいただき、スタートすることができました。

私が認識していた課題

この技術書典プロジェクトで私が解決したいと考えていた課題は2つあります。

グループ横断でのラフな技術アウトプットをすること

GMOインターネットグループは多くの企業で構成された連結グループであり、それぞれの企業にそれぞれのカラーをもったエンジニアが多数在籍しています。技術発信については、GMOインターネットグループのDeveloper Relationsチームが中心となり、年に一回GMO Developers Dayを開催しています。

テキストベースでのアウトプットについては、各社がOne Tech blogのようなテックブログを運営していて、それぞれ技術発信をしている状態でした。

これだけ多くのテックブログが乱立しているのであれば、それを合同誌化して頒布すればグループ横断での横のつながりも増えるし、大きなカンファレンスを開くほど手間もかからず、GMOインターネットグループ全体での技術の発信にも大きく寄与できると考えました。

商業作家デビューまでの架け橋となること

GMOインターネットグループでは、トップエンジニアとして活躍する方が多数在籍しており、書店に並ぶような書籍を執筆している技術書作家の方も在籍しています。私もいちエンジニアとして非常に憧れを持っており、いつか自分も商業作家デビューしてみたいという野望がありました。ですが、どういうマイルストーンを踏めばそこにたどり着けるのかいまいち分からないという課題がありました。

その時に技術書典での同人誌出版が商業作家への第一歩というお話を耳にし興味を持ちました。書き手としても、いきなり商業誌を書き始めるのは心理的ハードルが高いですが、同人誌だったらまず最初に自分の書籍が出来上がること、自分の手で頒布すること、出版社経由の自費出版と違い、そこまでのコストが掛からないことから手を付けやすい良い手段だと感じました。また、プロジェクト化しメンバーを募ることで、更にその障壁を下げ多くの商業作家候補を生み出すことができると考えました。

この課題を解決することで、結果としてGMOインターネットグループの技術ブランディング向上につながると感じたのです。

プロジェクト立ち上げ

まず初めに執筆者を募るため、グループ各社のテックブログ担当者をご紹介いただきました。エンジニア全体にいきなり声掛けしても良かったのですが、GMOインターネットグループはテックカンパニーであり、創る人比率が50%もあるため、母数で言えば3500名以上います。いきなりこの規模の人たちに声掛けするのは掛け手としても受け手としてもハードルが高いなと思いまず各社のテックブログでよく筆を執る人を中心に声掛けしようと考えたのです。

仲間集めのための資料を作成し動画を撮り、各社テックブログ担当の方にお声がけいただきました。結果としてグループ各社から6名のメンバーが集まり無事プロジェクトが立ち上がりました。

執筆環境の整備

環境はGitHub Organizationを作成し、組版ツールはRe:VIEWを利用しました。TechBoostarさんのReVIEW-Templateを利用させていただいております。複数人での執筆でしたが特に大きな問題もなく、ノンブル表示や目次など自動生成される為非常にスムーズに行うことができました。

この活動の裏ミッションとして「テックブログを書く感覚で技術書を書く」というミッションがあります。そのため記法はreview形式でなく、markdown形式としています。markdownからreviewへの変換は同梱されていたpandoc2reviewをそのまま利用しています。

configは電子書籍版と印刷版それぞれ作成し、デフォルトは紙版のconfig.yml、電子版のconfig-ebook.ymlはconfig.ymlを継承した形でそのまま電子書籍として配布できるよう表紙や裏表紙を追加した状態としました。

config-ebook.yml

inherit: ["config.yml"]
# 出力ファイル名
bookname: ebook
# 表紙に配置し、書籍の影絵にも利用する画像ファイル。省略した場合はnull (画像を使わない)。画像ディレクトリ内に置いてもディレクトリ名は不要(例: cover.jpg)
coverimage: cover/front.jpg
# 裏表紙データファイル (PDFMaker向けにはLaTeXソース断片、EPUBMaker向けにはHTMLファイル) 
backcover: ./images/cover/backcover.tex
# media=ebook 電子版 トンボなし
# paper=a5 用紙設定 A5サイズ
texdocumentclass: [
  "review-jsbook", 
  "media=ebook,paper=a5"
]

裏表紙指定のためのbackcover のみ画像ではなくtexファイルである必要があるためbackcover.texを作成しています。

backcover.tex

clearpage
\begin{titlepage}
\pagestyle{empty}
\centering % 中央揃えに設定
\noindent % 段落のインデントを無視
\hspace*{-20mm} % x軸方向(左)に20mm移動(必要に応じて調整)
\voffset=-32mm % y軸方向(上)に32mm移動(必要に応じて調整)
\includegraphics[width=\paperwidth,height=\paperheight]{./images/cover/back.jpg}
\end{titlepage}

pdfへのビルドはdockerを利用したローカルでのビルドとGitHub Actionsを利用したクラウドビルドを用意しました。それぞれ一度のビルドで電子版紙版両方ビルドされるようにしています。

Makefile

pdf:
    docker run --rm -v `pwd`:/work -w /work vvakame/review rake pdf
    docker run --rm -v `pwd`:/work -w /work vvakame/review review-pdfmaker config-ebook.yml

私はWindowsで執筆していましたが、Windowsだと’pwd’でパスが通らずdockerイメージのマウントができない問題もあったため、Windows向けにバッチファイルも作成しました

winpdf.bat

docker run --rm -v "%CD%":/work -w /work vvakame/review rake pdf
docker run --rm -v "%CD%":/work -w /work vvakame/review review-pdfmaker config-ebook.yml

GitHub Actionsでのビルドは、手動で行うためにworkflow_dispatchイベントをトリガとして利用しています。また、workflow_dispatchイベントは実行時に任意にブランチを指定できるため、どのブランチで実行したかワークフロー名でひと目でわかる用に、run-nameにgithub.ref_nameを出力するようにしています。ビルドされたpdfはupload-artifactを利用してzipにひとまとめするようにしました。

.github/workflows/build.yaml

name: make pdf

run-name: make pdf [${{ github.ref_name }}]

on:
  workflow_dispatch:

jobs:
  build:
    name: build review pdf
    runs-on: ubuntu-latest
    container: docker://vvakame/review:5.8

    steps:
    - uses: actions/checkout@master
    - name: build paper pdf
      run: rake pdf 
    - name: build ebook pdf
      run: review-pdfmaker config-ebook.yml
    - uses: actions/upload-artifact@master
      with:
        name: output-pdf
        path: ./*.pdf

執筆の流れ

上記の環境が整ったリポジトリを、執筆者各自にクローンしてもらいました。最初の一ヶ月ほどは各自自由に執筆、ビルドしてもらいながら進め、締切2週間前までにPRを出してもらう形で進めました。

PRの際は自身のセルフチェック+編集によるレビューとしました。以下のようなチェック項目を設定し進めました。

  • ローカルでエラーなくビルドが出来ていますか?
  • クラウドビルドを行って正しくPDFが生成できますか?
  • 図表は正しく表示されていますか?
  • 章番号や節番号をハードコードしていませんか?
  • 誤字脱字はありませんか?
  • emojiなど、特殊文字が正しく表示されていますか?
  • 補足説明は注釈を利用していますか?
  • ソースコードなどがページからはみ出して表示されていませんか?
  • ソースコードのインデントは「Spaces:2」になっていますか?
  • ソースコードが改行され読みづらくなっていませんか?
  • paper.pdfで、糊付け面までテキストがはみ出ていませんか?

執筆中に困った問題点

執筆中に上がった問題点として、2つ紹介します。

1つ目はシンタックスハイライトの問題です。
Re:VIEWでは内部的に利用しているLatexの機能を利用してシンタックスハイライトが利用できます。

ですが、どの言語でも行けるというわけではなく、対応している言語のみとなっています。この対応している言語というのが厄介で、すべての言語が対応しているわけではなく、しかも対応していない言語を指定した場合、ビルドエラーになってしまうのです。JavaScriptやTypeScriptなどの主要言語も対応していないので、注意が必要です。ただ印刷時はオフセット印刷の場合強制的に白黒になるため、電子版を重要視しない場合、そもそもシンタックスハイライトさせないというのも手かもしれません。

2つ目は改行の問題です。shellをそのまま貼り付けた場合などにあるハイフンの連続何かをそのまま貼り付けると、ビルド時に改行されず突き抜けてしまうことがありました。

またこれはListでも起こりうる問題で、半角英字の場合には糊付け面ギリギリまで文字がレンダリングされてしまうケースが有りました

これらは印刷所からの指摘で発覚しましたが対処としては該当箇所を消すか改行するかで調整する方法を取りました。

結果として得られたもの

こうして様々な困難がありましたが無事GMOインターネットグループの有志一同としての第一作目を世に出すことができました。

技術書典15では電子+紙合わせて合計570を超える売れ行きとなりました。Web記事でもテック記事だと初動1ヶ月で500pvは悪くない数字だと思います(One Tech blog調べ)。しかも紙媒体やPDFですので、アーカイブ性もありますし、200冊はこの世の何処かの本棚に今頃並んでいるはずということで、非常に良いアウトプットになったと実感しています!

また、オンラインで執筆作業を進めていたメンバーでしたが、技術書典15オフライン当日にはブースに皆さん立ち寄っていただき、グループ各社で交流を深めることができました。普段グループのイベントなどで交流する機会はありますが、一緒に一冊の本を作り上げた仲間で、それぞれの章を見ることでどんな人かもわかるということもあり、より深い繋がりができたのかなと思います。

#01と今回銘打ったのは、02も03も作っていくぞという意気込みでもあります。今回の第一作目の執筆を通して、当初自分が想定していた理想に確実に近づいていることが実感できました。次回以降も継続して頑張っていきたいと思います。

執筆に興味があるGMOインターネットグループパートナーはぜひ私のXアカウント@utautattaroまでご連絡をお待ちしております!

デベロッパーエキスパートとして

最後に、この活動をデベロッパーエキスパートとして意見をまとめたいと思います。デベロッパーエキスパートはこの記事冒頭に引用した通り”特定の専門分野における第一人者として業界の発展に寄与する”スペシャリティのある人材だと定義されています。実際私以外に選任されている方々は業界で第一人者として活躍されている面白い方達ばかりです。

今回の技術書プロジェクトでは私は立ち上げと運営、環境構築、書籍周りでは編集長として活動しました。執筆者としてコンテンツを寄稿するのは次回以降にしてまずは場作りに専念しようと考えたため今回は裏方に徹しています。

こうした背景として、私は「面白い人」と同じくらい「面白がる人」も重要だと考えています。今回のように多くの人を集めムーブメントに乗り、いいねいいねと周りを盛り上げていく「面白がる」方面で自分は貢献しようと考えました。結果として1+1が2以上、3以上になって行けるような結果に繋がっていくことを望んでいます。

この活動コンセプトがデベロッパーエキスパートの立ち振舞としてふさわしいかどうかについては、これからの評価のタイミングで様々な意見を聞きたいと思っています。ぜひコメントを頂けたら嬉しいです。

謝辞

最後に、本プロジェクト遂行に当たって執筆者の方だけではなく、多くの方に大変お力添えをいただきました。GMOペパボのボブさん、GMOインターネットグループ加藤さん、グローバルサイン・ホールディングス城戸さん、ご協力いただいた各社テックブログご担当者の皆様にこの場で感謝を申し上げさせていただきます。本当にありがとうございました。