Web+DB Press をシンタックスハイライトした話の裏側 #wdpress_party

稲尾さんとの思い出 Top 5 1. Web+DB Press をシンタックスハイライトした話 2. 打ち合わせの居酒屋で、間違って出されたウーロンハイを一口飲ん だら帰れなくなり稲尾さんに家まで送ってもらった話 3. 100号記念選書「TOPエンジニアを支える1冊」を選べと言われたので RFC6455 って言ったら没にされた話 4. 「執筆もペアプロでやってみたい」と稲尾さんに実際に Go を教えなが ら Go 入門を書くという合宿のために、稲尾さんを俺の家に缶詰にし た話 5. 次世代 Web カンファレンスの会場を稲尾さんが「著者の狩場」にして 無双してたので、二回目は自粛してもらった話

Web+DB Press を シンタックスハイライトした話 の裏側

技術書籍がシンタックスハ イライトされてないのは出版 社の怠慢である

白黒でもシンタックスハイライトはできる
type HasName = {
name: string;
}

type HasName = {
name: string;
}

type HasNameAndAge = {
name: string;
age: number;
}

type HasNameAndAge = {
name: string;
age: number;
}

const showName = (obj: HasName) => {
console.log(obj.name);
};

const showName = (obj: HasName) => {
console.log(obj.name);
};

const g: (obj: HasNameAndAge) => void = showName;

const g: (obj: HasNameAndAge) => void = showName;

g({
name: "uhyo",
age: 26,
});

g({
name: "uhyo",
age: 26,
});
プロを目指す人のためのTypeScript入門 安全なコードの書き方から高度な型の使い方まで

• https://gihyo.jp/dp/ebook/2022/978-4-297-12748-0

2019 年夏 :「連載しない?」 :「シンタックスハイライトて していいならいいよ」

Web+DB の執筆環境 ● 歴代の著者が執筆をサボるために作っ たツール群が活用されている ● md2inao やその Web UI など ● 放っておけば著者陣が勝手に改善する

Before ● md2inao ちょっといじ ればできるやろ ● まあ自分の原稿の範囲 だけでいいし ● 執筆の片手間でやろ After ● 誌面のデザインの変更がいるな ● マスタを一緒に刷新しちゃおう ● ついでに CS6 も CC にあげよ ● 作業用 Mac も古いからそれも一緒にリプ レースしちゃおう ● もちろん Web UI 作ってくれるよね？ ● md2inao の全記法対応してね

構成 ● Ruby の Rouge なら対応言語範囲が広い ● Kramdown でパースして AST だけもらう ● それを Indesign の XML に直接変換 開発 PoC してたので ここまではすぐできた 執筆

溢れ出す独自仕様たち ## 見出し ▼1.3 # 大見出し（節） ## 中見出し（項） ### 小見出し（目） ★赤文字になります ★ ☆赤文字になります ☆ □赤文字になります □ ▲赤文字になります ▲ ```js (注:見出し的に使う ) function bar(b) { **alert(b)**; (注:コメントがつけられます ) } ``` ``` !!! cmd ●図1::キャプション` (注:見出し的に使う ) $ **command** bar ``` 以下は WebDB マークになりま す。 ◆WDB◆

稲: こちらもご対応いただけますよね？ メタデータとして `UseMath: true` を書くと、インライン数式 `$...$` とディスプレイ数式 `$$...$$` の内部を Markdown として変換せずにそのまま保持するようになります。 UseMath: true インライン数式の例: $y = f(x_1, x_2)$ ディスプレイ数式の例: $$ f(t) = \lim_{p\to\infty}\frac{1}{2\pi i}\int_{c-ip}^{c+ip} F(s) e^{st} ds $$ ！！！？？？

だいたいやっつけた ● 全ケースを Issue 化して捌く ○ 書き方を変える ○ HTML を使う ○ パーサを直す ● プラグインサポート ○ AST フックするプラグインをさせるように ○ どうしても無理なものは勝手にやってもらう 開発 ● 二段階変換 ○ .md -> indesign -> gihyo flavord indesign 執筆

終わらない開発 2019 年末 ~ 2020 年正月 ● 仕事中も鳴り止まない GitHub 通知 ● 終わらない要望追加 ● 進まない原稿 開発 ● 本業よりもデスマ 執筆

🎉🎉 なんとかリリース 🎉🎉 理論寄 し！！ りの原稿な のでサ ！！！ ンプル ！！！ コード ！！！ ！！！ はほぼな ！！

あれ？他のページにも反映するんじゃなかったの？ あれ？その後の号はハイライトされないの？ 🤔

Web+DB Press を シンタックスハイライトした話 の裏側 の裏側 続きは懇親会で... Jack