VSCode+Markdownでプレゼン資料(PDF)
1年間 書きかけで放って 温めていたネタ😅
最近 VSCode+Markdownでプレゼン資料を作ったのでメモ。
Markdownいいよ、いいよ~
という話は前々からしていたけどMarkdownに慣れてしまうと、なんでもMarkdownにしたくなってくる(笑
もちろん得手不得手あるのでやり過ぎも良くはないことは重々承知。
自己満足だけどちょっとした資料であればさっとMarkdownで書けるに越したことはない。
使い捨てプレゼン
ところで、社会人になって15年。
数多のプレゼン資料が爆誕しては消えていくという現象を見続けてきた。
プレゼン資料は発表の為に作られた資料だから、終われば不要になるのは当然。
けれど慣れないプレゼンソフト使ってなんとか作ったものを捨てるのは忍びないものだ。
たまに
たまにチーム内でちょっとしたプレゼン(説明会)を行うことがある。
プロジェクターで伝えたいポイントが映せれば十分。
- 数行/ページくらい
- メインテーマやサブタイトルでプレゼンっぽく
- 目次を付けたい
- 箇条書きしたい
- 表をちょっと出したい
- 事前配布したい
こんなものはプレゼンソフト使わず
Markdownでぱっと作ってしまいたい
Markdown+VSCode
VSCodeは以前少し触れたが、豊富な拡張機能によりテキストエディタにとどまらずコーディングにもできちゃうソフト。 izana1018.hateblo.jp
Linux版も用意されてて、これでフリーとは太っ腹ですわ。
そんなVSCodeでプレゼン資料(っぽい)ものを作ってみたのでメモ。
ところでMarpってご存知?
Marp - Markdown Presentation Writer
なかなか面白いソフトでまさに「Markdownでプレゼン」するソフト。
これでもいいけどMarp入ってないとだめなので今回はパスです。
そこで閃きました
PDFにして全画面表示すればそれっぽくね?
これです。
PDFでプレゼン資料っぽく?
と聞くと難しそうなことやってるなーと思う人いるかもだけど、超単純です。
要するに
改ページ条件を決めるだけ
1ページの定義ができたら、Markdownの文章を調整してVSCodeでPDF出力すればよいだけ。簡単でしょ?
やりかた
STEP1「VSCodeに Markdown PDF をインストール」
Ctrl+Shift+Xで拡張機能の管理を表示して「markdown pdf」とでも入れたらyzaneさんのやつが出てくるのでインストール。
STEP2「改ページCSSの作成」
今回は分かりやすくMarkdown記法の「---」(水平線)で改ページするようにします。
水平線。
つまり、hrなので下記のようなCSSを用意して保存しておきます。
取り敢えず、”hr-page-break.css”とかにしときましょうか。
hr { border: none; page-break-after: always; }
STEP3「Markdownの用意」
# main title ## sub title - first - body --- ## first なんたらかんたら --- ## body うんたらかんたら
“Markdownでプレゼン資料.md” とでも作っておきましょ。
VSCodeで見るとこんな感じです。
STEP4「Markdown PDFのスタイルにCSSを指定」
Ctrl+commaで設定ファイルを開いて「markdown-pdf.styles」を設定します。
ユーザー設定 と ワークスペースの設定 があるけどお好みで。
プレゼン用の設定になるので、今回はワークスペースの設定に追加します。
// 既定の設定とユーザー設定を上書きするには、このファイル内に設定を挿入します { "markdown-pdf.styles": ["hr-page-break.css"] }
その他設定
PDFサイズ、用紙向き、ハイライトスタイルなどの設定を追加。
STEP5「PDF出力」
Markdownを右クリックしてPDF出力してみる。
こんな感じで出ます
全画面表示すればカーソルでページ送りとかも出来ます。
Markdownで作るメリット
正直プレゼンソフトのほうが「プレゼンやってる感」がある(笑
Markdownで作るメリットはなんだろうか
- 継続的にメンテしやすい
Markdown記法という縛りがあることで、誰でもメンテしやすい。
プレゼンソフトで作られたものは作者の思いが強すぎて、メンテしたくない(気持ち的に) - git管理で世代管理が楽ちん テキストファイルなので差分が取りやすい。
- 検索がしやすい これもテキストファイルが故にgrep検索などがしやすい。
まぁ適材適所ってことで。