これは、なにをしたくて書いたもの？
Markdownからスライドを作れるものを探してみて、Marpがよさそうだったので簡単に試してみることにしました。
Marp
MarpのWebサイトはこちら。
Marp: Markdown Presentation Ecosystem
デモを見ると、Makdownがほぼそのまま使えそうな感じですね。
--- theme: gaia _class: lead paginate: true backgroundColor: #fff backgroundImage: url('https://marp.app/assets/hero-background.svg') ---  # **Marp** Markdown Presentation Ecosystem https://marp.app/ --- # How to write slides Split pages by horizontal ruler (`---`). It's very simple! :satisfied: ```markdown # Slide 1 foobar --- # Slide 2 foobar ```
よさそうです。
使う方法としては、Visual Studio CodeのExtensionかCLIになりそうです。
GitHub - marp-team/marp-cli: A CLI interface for Marp and Marpit based converters
CLIはDockerイメージがありますね。
変換先についてですが、MarkdownからHTMLやPDF、PowerPoint、PNG／JPEGなどが生成できるようですね。
ただ、どうもWebサイト内にドキュメントが見当たらない気がします…。
どうもMarpitというフレームワークを見るようです。
Marp（Marpit）でMarkdownを書く場合に参照するのは、こちらですね。
Marpit: The skinny framework for creating slide deck from Markdown
テーマなどは、こちらからたどるとよさそうです。
GitHub - marp-team/awesome-marp: A curated list of awesome things related to Marp
それでは、Marpを簡単に使ってみます。
環境
今回の環境はこちら。
$ docker version Client: Docker Engine - Community Version: 28.1.1 API version: 1.49 Go version: go1.23.8 Git commit: 4eba377 Built: Fri Apr 18 09:52:14 2025 OS/Arch: linux/amd64 Context: default Server: Docker Engine - Community Engine: Version: 28.1.1 API version: 1.49 (minimum version 1.24) Go version: go1.23.8 Git commit: 01f442b Built: Fri Apr 18 09:52:14 2025 OS/Arch: linux/amd64 Experimental: false containerd: Version: 1.7.27 GitCommit: 05044ec0a9a75232cad458027ca83437aae3f4da runc: Version: 1.2.5 GitCommit: v1.2.5-0-g59923ef docker-init: Version: 0.19.0 GitCommit: de40ad0
Marpを使ってみる
では、Marpを使ってみましょう。Dockerイメージの使い方は、DockerHubのドキュメントを見るのがよいと思います。
Marpはファイルを出力するので、-vでディレクトリーをマウントすることになります。この時、ローカルユーザーと同じ
idで動作した方がよいので、MARP_USER環境変数でuid、gidを指定します。
$ docker container run -it --rm --name marp \ -e MARP_USER=$(id -u):$(id -g) \ -v $(pwd):/home/marp/app \ ghcr.io/marp-team/marp-cli:v4.1.2 \ doc.md
最後に指定しているのは、入力となるMarkdownファイルですね。
DockerイメージはGitHub Container Registryのものを使っていますが、DockerHubのものを使ってもOKです。
Marp CLIはファイルを変換すると終了するのですが、-wを付けてWatchモードにしてとファイルの変更を監視して、すぐに
変換してくれるようになります。
$ docker container run -it --rm --name marp \ -e MARP_USER=$(id -u):$(id -g) \ -v $(pwd):/home/marp/app \ ghcr.io/marp-team/marp-cli:v4.1.2 \ -w \ doc.md
今回作成したMarkdownはこちら。
doc.md
--- theme: gaia backgroundColor: #fff --- # 1ページ目 - 箇条書き1 - 箇条書き1-1 - 箇条書き2 1. 箇条書き2-1 1. **箇条書き**2-2 --- # 2ページ目 ### [CLOVER🍀](https://kazuhira-r.hatenablog.com/) メモ書きブログです。
最初に書いているこちらは、Global directivesというものですね。
--- theme: gaia backgroundColor: #fff ---
Directives / Global directives
テーマなどを指定します。今回はビルドインのGaiaテーマを使いました。
https://github.com/marp-team/marp-core/blob/v4.1.0/themes/README.md
あとはMarkdownを書いていきます。
# 1ページ目 - 箇条書き1 - 箇条書き1-1 - 箇条書き2 1. 箇条書き2-1 1. **箇条書き**2-2 --- # 2ページ目 ### [CLOVER🍀](https://kazuhira-r.hatenablog.com/) メモ書きブログです。
スライドの区切りは---で指定するようです。
Directives / Global directives/ Heading divider
今回の起動方法の場合、Markdownから拡張子を.htmlに変更したHTMLファイルができあがります。
見てみると、こんな感じになっています。
出力するファイル名やフォーマットを変更する場合は、ドキュメントを参照ということで。
おわりに
Markdownからスライドを作れるMarpを試してみました。
ほぼMarkdownのまま使えるのがよいなと思ったのですが、最初はドキュメントがどこにあるのかわからなくて見つけるのに
苦労しました。
手軽に使えるのがよい感じなので、覚えておくといいかなと思います。
