📚

Marp for VS Code が簡単・便利

2023/06/25に公開

はじめに

  • 先日久しぶりにブログ記事を書いてみましたが、随分煩雑になってしまいました。
  • もっと簡潔に、プレゼン資料のように書いてみようと考えていたら、Marpを思い出し、早速使ってみることにしました。
  • 今回はVS Codeで書こうと思うので、プラグイン Marp for VS Code をインストールします。
  • 試しに作ったスライドを流用したので、スライドのような、ブログ記事のような微妙な仕上がりになってしまいました。

Marpとは

  • 一言で言うと

    • Markdownでプレゼン・スライドを作成できる、オープンソースのツールです。
  • 機能

    • 標準Markdown文法に加えて、ディレクティブ、拡張文法が用意されています。
    • HTML、PDF、PowerPointにエクスポートできます。
    • 標準でテーマが用意されており、別途CSSで独自のテーマも作成できます。

インストール

  • 拡張機能からMarpで検索するとMarp for VS Codeがhitするのでインストールします。

  • .md ファイルを作成すると画面右上に、以下のアイコンが表示されます。左から2番目がプレビュー画面の表示、3番目がコマンド入力欄です。

書式

  • ファイル上部、Front Matter部分に以下を記載します。

    ---
    marp: true
    ---
    
  • Front Matterには他にも、テーマの指定やページングなど項目があるので調べてみてください。

    theme: gaia
    paginate: true
    
  • ページ区切りは --- で表現します。ページ区切りを指定しないと、収まらない部分は表示されません。

その他

  • 私は当面シンプルなスライドしか作る予定がないので、今のところ困ったことはありませんが、検索すると色々用例が見つかるので、結構実用的なのではないかと思います。

  • ChatGPTに色々質問した後、例えば

    上記の内容をプレゼン風に要約してMarp形式で書いてください。
    

    上記のようにお願いすると、きちんとMarpで書いてくれます。今回のブログ記事は自分で書いてしまいましたが。

参考

  • Marp公式

  • プラグイン公式

  • Marp CLI
    CLIを使えばプログラムとして活用できますね。インストール方法、使い方は上記のREADMEがわかりやすいです。

  • Marpit
    Marpから派生した拡張機能です。

Discussion