メインコンテンツにスキップ

Markdown Table Generator

Markdownテーブルを簡単に作成・編集するツールです。CSV、JSONデータをMarkdownテーブルに変換したり、直接テーブルを編集できます!

主要機能​

1. 2つの入力モード​

Table Mode​

  • ビジュアルテーブルエディタ
  • セル単位で直接入力
  • 行/列の追加と削除
  • カラムの配置設定

CSV/JSON Mode​

  • CSVデータをテーブルに変換
  • JSON配列をテーブルに変換
  • 大量データの高速入力

2. 配置オプション​

各カラムごとに配置設定が可能:

  • 左揃え (:---)
  • 中央揃え (:---:)
  • 右揃え (---:)

3. リアルタイムプレビュー​

  • Markdown出力を即座に確認
  • レンダリングされたテーブルのプレビュー

使用例​

基本テーブルの作成​

入力:

Header 1 | Header 2 | Header 3
Cell 1-1 | Cell 1-2 | Cell 1-3
Cell 2-1 | Cell 2-2 | Cell 2-3

Markdown出力:

| Header 1 | Header 2 | Header 3 |
| :--- | :--- | :--- |
| Cell 1-1 | Cell 1-2 | Cell 1-3 |
| Cell 2-1 | Cell 2-2 | Cell 2-3 |

CSVデータの変換​

CSV入力:

Name, Age, City
John Doe, 30, New York
Jane Smith, 25, Los Angeles
Bob Johnson, 35, Chicago

Markdown出力:

| Name | Age | City |
| :--- | :--- | :--- |
| John Doe | 30 | New York |
| Jane Smith | 25 | Los Angeles |
| Bob Johnson | 35 | Chicago |

JSONデータの変換​

JSON入力:

[
{"name": "John", "age": 30, "city": "NYC"},
{"name": "Jane", "age": 25, "city": "LA"},
{"name": "Bob", "age": 35, "city": "Chicago"}
]

Markdown出力:

| name | age | city |
| :--- | :--- | :--- |
| John | 30 | NYC |
| Jane | 25 | LA |
| Bob | 35 | Chicago |

ユースケース​

1. README.md作成​

# API Documentation

## Endpoints

| Method | Endpoint | Description | Auth Required |
| :--- | :--- | :--- | :---: |
| GET | /api/users | Get all users | ✓ |
| POST | /api/users | Create user | ✓ |
| GET | /api/users/:id | Get user by ID | ✓ |
| DELETE | /api/users/:id | Delete user | ✓ |

2. 技術仕様ドキュメント​

## Browser Support

| Browser | Version | Status |
| :--- | :---: | :---: |
| Chrome | 90+ | ✅ |
| Firefox | 88+ | ✅ |
| Safari | 14+ | ✅ |
| Edge | 90+ | ✅ |
| IE11 | - | ❌ |

3. 比較表​

## Plan Comparison

| Feature | Free | Pro | Enterprise |
| :--- | :---: | :---: | :---: |
| Users | 5 | 50 | Unlimited |
| Storage | 1GB | 100GB | 1TB |
| Support | Email | Priority | 24/7 |
| Price | $0 | $29/mo | Custom |

4. 統計データ​

## Monthly Statistics

| Month | Users | Revenue | Growth |
| :--- | ---: | ---: | ---: |
| January | 1,234 | $12,345 | +5% |
| February | 1,456 | $14,567 | +18% |
| March | 1,789 | $17,890 | +23% |

配置ガイド​

左揃え (:---)​

テキストカラムに適しています

| Name | Description |
| :--- | :--- |
| John | Developer |

中央揃え (:---:)​

短い値やステータスに適しています

| Status | Active |
| :---: | :---: |
| ✓ | Yes |

右揃え (---:)​

数値データに適しています

| Price | Quantity |
| ---: | ---: |
| $99.99 | 100 |

CSVパースのヒント​

1. カンマ区切り​

name,age,city
John,30,NYC
Jane,25,LA

2. 自動スペース削除​

name , age , city
John , 30 , NYC

3. 複数行コピー​

ExcelやGoogleスプレッドシートからコピー:

  1. セル範囲を選択
  2. Ctrl+C(コピー)
  3. CSV Modeに貼り付け
  4. Parse as CSVをクリック

JSONパースのヒント​

1. オブジェクト配列​

[
{"id": 1, "name": "John"},
{"id": 2, "name": "Jane"}
]

2. キー順序の維持​

最初のオブジェクトのキー順序がカラム順序になります

3. ネストされたオブジェクト​

ネストされたオブジェクトは [object Object] として表示されます フラットな構造を推奨します

高度な機能​

1. 素早い行/列編集​

  • 行追加: 下部の「+ Row」ボタン
  • 列追加: 右側の「+ Col」ボタン
  • 削除: 各行/列の「✕」ボタン

2. サイズ調整​

  • 行数: 1-50
  • 列数: 1-20
  • 入力フィールドで素早く調整

3. コピー&ペースト​

  • 各セルをクリックして編集
  • Ctrl+C/Vでコピー/ペースト可能

Markdown拡張構文​

GitHub Flavored Markdown​

GitHubでは追加機能をサポート:

| Syntax | Description | Test Text |
| --- | --- | --- |
| Header | Title | Here's this |
| Paragraph | Text | And more |

セル内のフォーマット​

| Feature | Status |
| --- | --- |
| **Bold** | *Italic* |
| `Code` | [Link](url) |

絵文字の使用​

| Status | Icon |
| --- | :---: |
| Success | ✅ |
| Warning | ⚠️ |
| Error | ❌ |

ベストプラクティス​

1. 明確なヘッダー​

✅ Good:
| User Name | Email Address | Registration Date |

❌ Bad:
| Name | Email | Date |

2. 一貫した形式​

✅ Good: すべての日付がYYYY-MM-DD
| Date |
| 2024-01-15 |
| 2024-01-16 |

❌ Bad: 混合形式
| Date |
| Jan 15, 2024 |
| 2024-01-16 |

3. 適切な配置​

✅ Good:
| Name | Price | Qty |
| :--- | ---: | ---: |

❌ Bad: すべてのカラムを左揃え

4. 短く保つ​

長すぎるテーブルは複数に分割:

## User Info
| Name | Email |
| --- | --- |
| John | john@example.com |

## User Stats
| Name | Orders | Revenue |
| --- | ---: | ---: |
| John | 10 | $500 |

注意事項​

  • Markdownテーブルは複雑なレイアウトをサポートしていません
  • セルのマージ(colspan、rowspan)はサポートされていません
  • 非常に大きなテーブルは可読性が低下します(10-15カラム以下を推奨)
  • CSVパースは引用符で囲まれたカンマを処理できません

関連ツール​

キーボードショートカット(将来サポート予定)​

  • Tab - 次のセルに移動
  • Shift + Tab - 前のセルに移動
  • Enter - 次の行に移動
  • Ctrl + Enter - 新しい行を追加

追加リソース​