🖊️
Markdown 書式シート（記法 + プレビュー）
概要
Markdownの書き方忘備録まとめた。
ここに載ってないことをしたい場合はHTMLタグやね😑
📝 見出し（Heading）
記法:
# 見出し1
## 見出し2
### 見出し3
表示例:
見出し1
見出し2
見出し3
📄 改行・段落
記法:
これは段落です。
これは別の段落です。
行末に半角スペース2つで
改行されます。
表示例:
これは段落です。
これは別の段落です。
行末に半角スペース2つで
改行されます。
🔡 強調
記法:
*斜体* / _斜体_
**太字** / __太字__
~~打ち消し線~~
表示例:
斜体 / 斜体
太字 / 太字
打ち消し線
🔢 番号付きリスト
記法:
1. りんご
2. みかん
3. バナナ
表示例:
- りんご
- みかん
- バナナ
🔘 番号なしリスト
記法:
- 犬
- 柴犬
- 黒柴
- 猫
- 鳥
表示例:
-
犬
-
柴犬
- 黒柴
-
-
猫
-
鳥
☑ チェックリスト
記法:
- [ ] やること
- [x] 済んだこと
表示例:
- やること
- 済んだこと
🔗 リンク
記法:
[Google](https://www.google.com)
<https://www.google.com>
表示例:
🖼️ 画像
記法:
表示例:
🔤 引用
記法:
> これは引用です。
>> 二重引用もできます。
表示例:
これは引用です。
二重引用もできます。
💻 コード
インライン:
これは `コード` です。
表示例:
これは コード です。
コードブロック:
```js
console.log("Hello Markdown");
表示例:
```js
console.log("Hello Markdown");
📏 水平線
記法:
---
***
___
表示例:
🧱 テーブル
記法:
| 項目 | 数量 | 単価 |
|------|------|------|
| りんご | 3 | 100円 |
| みかん | 5 | 80円 |
表示例:
| 項目 | 数量 | 単価 |
|---|---|---|
| りんご | 3 | 100円 |
| みかん | 5 | 80円 |
🧠 コメント
記法:
<!-- この行はプレビューには表示されません -->
表示例:
（※何も表示されません）
🎵 エスケープ（無効化）
記法:
\*これは強調ではありません\*
\# 見出しではない
表示例:
*これは強調ではありません*
# 見出しではない
UML図(Mermaid)
1. 📊 フローチャート（flowchart）
```mermaid
flowchart TD
A[スタート] --> B{条件分岐}
B -- はい --> C[処理A]
B -- いいえ --> D[処理B]
C --> E[終了]
D --> E
```
表示例：
2. 📞 シーケンス図（sequenceDiagram）
```mermaid
sequenceDiagram
participant ユーザー
participant サーバー
participant DB
ユーザー->>サーバー: ログイン要求
サーバー->>DB: 認証情報確認
DB-->>サーバー: OK
サーバー-->>ユーザー: ログイン成功
```
表示例：
3. 🧱 クラス図（classDiagram）
```mermaid
classDiagram
class Animal {
+String name
+void eat()
}
class Dog {
+void bark()
}
Animal <|-- Dog
```
表示例：
4. 🔁 状態遷移図（stateDiagram）
```mermaid
stateDiagram-v2
[*] --> Idle
Idle --> Loading : 開始
Loading --> Success : 成功
Loading --> Error : 失敗
Success --> [*]
Error --> [*]
```
表示例：
5. 📅 ガントチャート（gantt）
```mermaid
gantt
title 開発スケジュール
dateFormat YYYY-MM-DD
section 要件定義
作業A :done, a1, 2024-07-01, 3d
作業B :active, a2, 2024-07-04, 4d
section 実装
実装A : a3, after a2, 5d
テスト : a4, after a3, 2d
```
表示例：
6. 🗃️ ER図（erDiagram）
```mermaid
erDiagram
USERS ||--o{ ORDERS : has
USERS {
int id PK
string name
}
ORDERS {
int id PK
int user_id FK
string item_name
}
```
表示例：
7. 📊 パイチャート（pie）
```mermaid
pie
title 技術スキル構成
"PHP" : 40
"JavaScript" : 25
"TypeScript" : 15
"その他" : 20
```
表示例：
🧠 補足：共通ルール
- Mermaidは Markdown内コードブロック として記述（必ず
```mermaidで囲む） - Mermaid描画が対応していない環境（GitHubなど）では図は表示されません
- VSCodeで表示するには 拡張機能（Mermaid Preview等） が必要です
Discussion