※当サイトではGoogleAdSense、アフィリエイトを使用した商品の紹介で収益を得ています。

VS Codeを使ってブログの下書きをする際にオススメの拡張機能を5つ紹介

monitor pc
出典:https://www.pexels.com/
この記事は約5分で読めます。

以前にブログの下書きをする際に、Atomエディターを使用しているという記事を書きました
しかし、Atomエディターは開発が終了してしまい、現在はVS Codeを下書き用に使用しています

本記事では、VS Codeでブログの下書きをする際に入れておくと便利な拡張機能を5つ紹介します
また、おまけとして、以前Atomエディターを使用していた方へ入れておくと良いかも?というテーマも紹介します

Sponsor Link
Sponsor Link

Visual Studio Code

VS Codeは以下のサイトからダウンロードして、インストールしましょう

Markdown関連

GutenbergがMarkdownに対応しているので、Markdownを強化できる拡張機能を入れておくといいでしょう
紹介している3つ以外にも、結構な数があるので気に入ったものをいれると良いかもしれません

Markdown All in One

Markdown All in Oneは、Markdown文法の記述を効率化するための拡張機能です
この拡張機能を使用すると、ショートカットキーを使って簡単にMarkdownのスニペットを挿入したり、コマンドパレットからMarkdown関連の機能を呼び出したりできるので便利です
リストや表、見出しなどのMarkdownの要素を自動補完してくれるので作業の効率化に役立ちますよ

Markdown Preview Enhanced

Markdown Preview Enhancedは、VS Code上でリアルタイムにMarkdownのプレビューを表示するための拡張機能です
Markdownファイルを編集しながら、プレビューペインに表示される結果を確認ができます
書いているものがどのように表示されるかが見てわかるので、かなり便利です

画像のようにクリックする、または、ショートカットキーでプレビューを開くことができます
ショートカットキーは拡張機能のオプションから変更することができるので、他とかぶらないキーで好みのキーに変更するといいでしょう

markdownlint

markdownlintは、Markdown文法のチェックを行うための拡張機能です
文法上のエラーや一貫性のないスタイルを検出して表示し、品質の向上をサポートします
この拡張機能は、リアルタイムにMarkdown文書を監視してエラーハイライトを表示するため、文法ミスを素早く発見ができます

Sponsor Link

テキスト校正くん

テキスト校正くんは、日本語の文章の校正支援を行う拡張機能です
文法の誤りや表現の問題、冗長な表現などを検出し、修正の提案をしてくれます
さらに、スタイルガイドに基づいたチェックも行ってくれるため、ブログ記事の品質向上に役立ちます

options

オプションからチェックをする項目の変更ができます

CharacterCount

CharacterCountは、文字数や単語数、行数をカウントするための拡張機能です
ブログの下書きを作成する際に、文字数や単語数の制限がある場合に便利です
この拡張機能を使えば、リアルタイムで現在のカウントを確認できます

Atom One Dark Theme

Atomエディターを使用していた方向けのテーマ
Atom One Dark Themeは、VStudio Code用の人気のあるテーマで、Atomエディターの同名のテーマをベースにしています
このテーマは、暗い背景と明るい文字を使用した読みやすいダークテーマで、構文の強調表示やシンボルの色分けなど、多くの機能も備えています

注意点について

保存する拡張子とブログエディターへ貼り付ける際の注意点について

保存ファイルの拡張子について

下書き用に各ファイルの拡張子についてですが、必ず.mdとして保存しましょう
こうしないと、ファイルをMarkdownと認識されませんので注意してください

下書きを貼り付ける際の注意点

VS CodeからGutenbergへ貼り付ける際に、そのままペーストをすると左の画像の様に書いた状態のまま貼り付けられてしまいます
そのため、貼り付ける際に右クリックメニューを開き、プレーンテキストとして貼り付けを選びましょう
上記メニューは、私が使っているブラウザのVivaldiでの表記ですが、他のブラウザも似たようなものがある筈です

まとめ

本記事ではVS Codeをブログ用の下書きに使用する際に、あると便利な拡張機能5つを紹介しました
また、以前にAtomエディターを使用していた方向けのテーマも一緒に紹介しています

ブログを書く際、直接サイトを開いてエディターで記事を書いていく人が圧倒的に多いと思います
しかし、Gutenbergのせいなのか、たまに動作が重くなる、重く感じることはありませんか?
同じようなことを感じたことがある方は、VS Codeと今回紹介した拡張機能を試してみてください

VS Codeに限らず、Markdownに対応しているエディターであれば、下書きとして使えるので試してみてください

[share]