Marp+github.dev+GitHub ActionsでLT会用スライドPDFをブラウザ上で気軽に作成

Last updated at 2025-02-15Posted at 2025-02-15

1. はじめに

皆さん、LT会(Lightning Talk会)に参加してますか？
LT会で話したいことがあったのに、スライド作るの面倒で参加しなかったことはありませんか？
本記事で紹介する Marp, github.dev, GitHub Actions を活用した効率的なスライド作成方法で、気軽にLT会の準備をしませんか

2. LT会でのスライド作成の課題

2.1. 時間的制約

LT会まで時間が限られているため、スライド作成にかけられる時間が短い
短時間で内容をまとめ、分かりやすくスライドに落とし込む必要がある

2.2. ソフトウェア・環境

スライド作成ソフトの操作に不慣れな場合、作成に時間がかかる
共同作業の場合、ファイル共有やバージョン管理が煩雑になる

2.3. デザイン・レイアウト

短時間で聴衆の興味を引くスライドを作成する必要がある
デザインの知識やセンスが求められる

3. Marp, github.dev, GitHub Actions を使うことのメリット

3.1. Marp

Markdown 形式でのスライド作成: Marp は Markdown 形式でスライドを作成できるため、テキストエディタで手軽にスライドを作成できます
シンプルな操作性: Markdown 形式での記述に慣れていれば、直感的にスライドを作成できます
豊富なテーマ: 多様なテーマが用意されており、デザイン性の高いスライドを簡単に作成できます
ソースの挿入が楽: スライドにシンタックスハイライト付きソースコードを挿入するのが楽

3.2. github.dev

ブラウザ上で開発可能: github.dev はブラウザ上で VS Code を利用できるため、場所を選ばずにスライド作成・編集作業を行えます
GitHub との連携: GitHub リポジトリと連携できるため、スライドのバージョン管理や共同作業が容易になります

3.3. GitHub Actions

スライド作成の自動化: GitHub Actions を利用することで、スライドの PDF 変換を自動化できる
PDF 変換に必要なソフトウェアのインストールをしなくても、ブラウザからの指示で変換できる

3.4 組み合わせによる効果

これらのツールを組み合わせることで、スライド作成から PDF 生成、そして共有までの一連の作業を効率的に行えます。

場所を選ばないスライド作成: github.dev,GitHub Actions により、どこでもブラウザさえあればスライド作成が可能になります
共同作業の円滑化: GitHub を利用したバージョン管理や共同編集により、複数人でのスライド作成がスムーズに進みます

これらのメリットを最大限に活かすことで、LT 会に向けたスライド作成をより効率的に、そして質の高いものにすることができます。

4. テンプレートリポジトリの紹介&使い方説明

私が作成した Marp スライド作成テンプレートリポジトリを紹介し、その使い方を説明します。

4.1. テンプレートリポジトリのリンク

4.2. テンプレートリポジトリの内容

├── .devcontainer
│   └── devcontainer.json # GitHub Codespaces設定ファイル
├── .github
│   └── workflows
│       └── marp.yml # GitHub Actions設定ファイル
├── .vscode
│   └── settings.json # VSCode設定ファイル
├── LICENSE
├── README.md
├── pdf # GitHub Actionsで変換したPDFファイルの出力先
│   └── .gitkeep
├── target.txt # GitHub Actionsで処理するMarpファイルのパスを指定するためのファイル 
├── サンプルスライド
│   ├── sample.md # サンプルスライドのMarpファイル
│   └── サンプルイラスト.png # サンプルスライドで使うイラスト
└── ロゴ画像 # サンプルスライドで使うロゴ画像 
    ├── サンプルロゴ.png
    ├── サンプルロゴ_small.png
    └── サンプルロゴ_タイトルスライド用.png