日頃からプレゼンテーション資料を作る場面が多く,PowerPoint と Keynote をよく使う.さらにプレゼンテーション資料にシンタックスハイライトをしたコード(JSON / YAML なども含む)を載せることもある.今まで何度も「どうやってシンタックスハイライトをしてる?」と聞かれたため,毎回同じことを教えるのではなく,サッと URL を渡せるようにブログにまとめることにした.
なお,2017年に公開した 「個人的な Keynote ベストプラクティス 2017」 に highlight
コマンド と pbcopy
コマンドを組み合わせる方法を載せているけど,今回はさらに選択肢を増やして「計3種類」紹介したいと思う.
- Visual Studio Code を使う
highlight
コマンド とpbcopy
コマンドを組み合わせて使う- Carbon を使う
1. Visual Studio Code を使う
最もお手軽に使えるのは Visual Studio Code (VS Code) だと思う.VS Code から直接コピーすると,PowerPoint / Keynote にシンタックスハイライトをしたコードをペーストできる.案外知られてなく,紹介すると驚かれることもある.なお,IntelliJ IDEA / GoLand なども同様に使えるため,慣れたエディタから直接コピーすると良いと思う.以下は A Tour of Go のサンプルコードを Keynote に載せている.
2. highlight
コマンド と pbcopy
コマンドを組み合わせて使う
次に紹介するのは highlight
コマンド と pbcopy
コマンドを組み合わせる方法で,数年前から個人的にずっと使っている.以下のようにファイルを指定してコマンドを実行すると,自動的にクリップボードに保存されるため,そのまま PowerPoint / Keynote にペーストできる.以下は同様のサンプルコードを Keynote に載せている.
$ highlight -O rtf main.go | pbcopy
また highlight
コマンドに --style
オプションを設定するとデザインを変えることもできる.以下は Moria
スタイルを設定し,同様のサンプルコードを Keynote に載せている.
$ highlight -O rtf --style Moria main.go | pbcopy
highlight
コマンドの詳細は以下に載っている.
3. Carbon を使う
「Carbon」を使うと,シンタックスハイライトをしたコードを画像に変換できる.GitHub の実装を読むと highlight.js
というライブラリに依存していた.Carbon はデザインに限らず,ウィンドウサイズ/行数/背景色など自由度高く設定できる点が良く,以下は同様のサンプルコードを Carbon で調整し,Keynote に載せている.
まとめ
PowerPoint / Keynote にシンタックスハイライトをしたコード(JSON / YAML なども含む)を載せる方法を「計3種類」紹介した.目的により,自分に合った方法を選ぶと良いと思う.よく聞かれることは今後も積極的にブログに書いていくぞ!
関連記事
以下の記事も「プレゼンテーション中にうまくデモを見せる Tips」をよく聞かれるため,まとめた記事となる.