自分好みのMarkdownエディターを求めて
わたしは、開発しているアプリの仕様やQiitaに投稿する文章などを、マークダウンで書いています。
CotEditorがお気に入りなので、マークダウンで書くときはCotEditorをつかっています。しかし、アプリのスクリーンショットを載せられなかったり、つくった資料をPDFに出力して配布できなかったりして困っていました(そういうときは、Pagesをつかっていました)。
そんな悩みを抱えていたときに、会社の人にVisual Studio Codeの Markdown PDF を教えてもらいました。
Makdown PDFをつかってみよう
Markdown PDFは、その名のとおりマークダウンのテキストをPDFに出力してくれるVS Codeの拡張機能です。
試しにつかってみたらとても便利だったので、インストール手順と使用方法を紹介します。

まず、VS Codeの拡張機能をクリックして、検索欄に「Markdown PDF」と入力します。
すると、Markdown PDFが表示されるので、インストールボタンをクリックしてインストールします。
これでインストールは完了です。
つぎに、PDFにしたいファイルを開いて、command + shift + pを押します。

すると、検索窓が開くので、「export」と入力します。
表示される候補のなかから、「Markdown PDF: Export (pdf)」を選択します。

PDFが出力されました。
出力先は、左下のステータスバーに表示されるので、見にいってみましょう。

ダウンロードフォルダーにPDFが作成されています。やったね!

リンクや画像もバッチリですし、ページ番号も振ってくれます。
しかも、けっこう見栄え良くしてくれます。
Mac標準のPagesもいいアプリですが、ちょっとした資料をつくるには機能が多すぎます。
複雑なレイアウトの資料でなければ、マークダウン+Markdown PDFで、手軽に書けるようになりました。
文章の校正のお供にテキスト校正くんをつかおう
文章は書くのもたいへんですが、校正もたいへんです。
そんなときに便利なのが、VS Codeの拡張機能 テキスト校正くん です。

VS Codeの拡張機能をクリックして、検索欄に「テキスト校正くん」と入力します。
すると、テキスト校正くんが表示されるので、インストールボタンをクリックしてインストールします。
これでインストールは完了です。
校正するときは、VS Codeでテキストファイルを開くだけです。

テキスト校正くんが開いたテキストファイルの文章を自動的にチェックして、画面下の問題パネルに文章の問題点を表示してくれます。
とても便利で素敵ですね!
おまけ 〜VS Codeでファイルのパスを取得する〜
VS Codeで画像を表示するときには、画像のパスを取得する必要があります。
VS Codeをつかうと、パスの取得も簡単にできます。

画像ファイルをVS Codeにドラッグ&ドロップすると、画像が表示されます。画像のタブを右クリックして、「パスのコピー」をクリックすると、 /Users/toshi/Downloads/VSCode/009.png
のようにファイルのパスをコピーしてくれます。

あとは、 
のようにマークダウンでリンクを書くと、VS Codeに画像を表示してくれます。
最近VS Codeを使いはじめましたが、簡単に機能を拡張できていいですね。Markdown PDFやテキスト校正くんのような便利な拡張機能を作成してくださった方々にも感謝です。
VS Codeを活用して、バリバリ文章を書いていきましょう。