開発ドキュメントやREADME.md、ブログの下書きなど、エンジニアにとってMarkdownを書く機会は多いですよね。様々なエディタがありますが、やはり最強なのは Visual Studio Code (VS Code) です。
今回は、VS CodeでMarkdownを書く際に「これだけ覚えておけば爆速で書ける」というショートカットと、コピペですぐに使えるチートシートをまとめました。
標準的な記法だけでなく、VS Codeならではの便利機能（プレビュー表示や図の描画）も網羅しています。
1. なぜVS CodeでMarkdownなのか？
VS CodeでMarkdownを書く最大のメリットは、「プレビュー機能」と「強力なショートカット」です。拡張機能を入れなくても、数式やフローチャート（Mermaid）まで標準で表示できるようになったのは大きな魅力です。
2. 【コピペ用】Markdownチートシート (VS Code版)
以下のコードブロックをコピーして、CheatSheet.md などの名前で保存しておくと、いつでも記法を確認できる「自分専用の教科書」になります。
# Markdown チートシート (VS Code版)
VS Codeで快適にドキュメントを書くための、標準記法と便利機能のまとめです。
---
## 1. VS Code 便利なショートカット & 機能
VS CodeでMarkdownを編集する際に知っておくと効率が上がる機能です。
### プレビュー操作
| 機能 | Windows / Linux | Mac |
| :--- | :--- | :--- |
| **プレビューを横に表示** | `Ctrl` + `K` → `V` | `Cmd` + `K` → `V` |
| **プレビューのみ表示** | `Ctrl` + `Shift` + `V` | `Cmd` + `Shift` + `V` |
### テキスト編集ショートカット
| 機能 | Windows / Linux | Mac |
| :--- | :--- | :--- |
| **太字にする** | `Ctrl` + `B` | `Cmd` + `B` |
| **斜体にする** | `Ctrl` + `I` | `Cmd` + `I` |
| **リンクの挿入** | 範囲選択してURLをペースト | (同左) |
### リージョン（折りたたみ）
長いドキュメントの一部をVS Code上で折りたためるようにします。プレビューには影響しません。
ここからここまでが折りたためます
---
## 2. 基本記法 (Standard Syntax)
### 見出し (Headers)
`#` の数でレベルを指定。後ろに半角スペース必須。
# H1 見出し
## H2 見出し
### H3 見出し
#### H4 見出し
### 文字装飾 (Emphasis)
* `**太字**` → **太字**
* `*斜体*` → *斜体*
* `~~取り消し線~~` → ~~取り消し線~~
* `` `インラインコード` `` → `インラインコード`
### リスト (Lists)
#### 箇条書き
ハイフン `-`、アスタリスク `*`、プラス `+` が使用可能。
- リスト1
- ネスト（Tabキーでインデント）
- 更にネスト
- リスト2
#### 番号付きリスト
数字は自動で採番されるため、すべて `1.` でもOK。
1. 手順A
1. 手順B
1. 手順C
#### チェックリスト (Task Lists)
- [ ] 未完了タスク
- [x] 完了タスク
### リンクと画像 (Links & Images)
* **リンク**: `[表示テキスト](URL)`
* 例: [Google](https://google.com)
* **画像**: ``
* 例: ``
### 引用 (Blockquotes)
> 引用文
> > 二重引用
### 水平線 (Horizontal Rules)
`---` または `***` で区切り線を表示。
---
## 3. コードブロック (Code Blocks)
バッククォート3つで囲みます。言語指定でシンタックスハイライトが効きます。
```python
# Pythonの例
def hello():
print("Hello VS Code")3. 特に知っておきたいポイント解説
プレビューのショートカット
Markdownを書く上で一番面倒なのが「プレビュー画面を開く」作業です。マウスを使わず、以下のショートカットを指に覚えさせると作業効率が格段に上がります。
- Windows:
Ctrl + Kを押して離してからV - Mac:
Cmd + Kを押して離してからV
Mermaid記法による作図
以前は拡張機能が必須でしたが、現在のVS Codeは標準でMermaid記法のプレビューに対応しています。フローチャートやシーケンス図も、テキストベースで書いてすぐに確認できます。
URLの貼り付け
ブラウザでURLをコピーし、Markdown上のテキストを選択した状態で Ctrl + V (Macは Cmd + V) を押すだけで、自動的に [選択テキスト](URL) の形式でリンクを作成してくれます。（※設定で Markdown > Editor: Paste Url As Formatted Link が有効になっている必要があります）
まとめ
VS CodeはMarkdownエディタとしても非常に優秀です。
このチートシートを活用して、快適なドキュメント作成ライフを送ってください！
コメント