JSON から Markdown

関連おすすめ

JSON から Markdown 変換と Markdown テーブルについて

ユースケース

• 技術ドキュメント作成時にAPIから返されたJSONデータをMarkdownテーブルに変換して表示
• GitHub READMEで設定データ、パラメータ説明、APIレスポンス例を表示する必要がある場合
• データレポートをMarkdownテーブルで分析結果を提示（エクスポート後Notion / Confluenceに埋め込み可能）
• APIドキュメント（Swagger / Redoc / OpenAPI）でインターフェースが返すデータ構造を明確に表示
• VuePress / Docusaurus / Hexoなどの静的サイトジェネレーターのドキュメントセクション
• Slack / Discord / 企業IMで構造化データを共有（GFMはこれらのプラットフォームでネイティブサポート）
• VS Code / JetBrains IDEのMarkdown Previewでテーブル効果を即時プレビュー
• バージョン管理コラボレーション：Markdownテーブルは純粋なテキストで、git diff に優しく、Code Reviewに便利
• 教育シーン：データ構造の授業で学生が提出したネストJSONの課題をテーブルに変換して統一表示・採点
• メールテンプレート（Bear Mail、HEYなどMarkdown対応メールクライアント）
• Notionデータベースインポート：まず本ツールでMarkdownテーブルを生成し、Notionに貼り付けるだけ
• 国際化シーン：JSONフラット化 + キー名整形後、日中ドキュメントで同じ構造を共有

使い方

1. 左側のエディタにJSON配列（推奨）またはネストオブジェクトを貼り付けるか、「Sample」をクリックして3件のネストユーザーサンプルを読み込むか、「Upload」をクリックして .json / .txt ファイルをアップロード
2. ツールバーでネスト処理モードを選択（「Flatten（フラット化）」推奨）、JSONに複数層のネストがある場合は Max Depth を高く調整
3. カスタム区切り文字が必要な場合は、Separator 入力ボックスに入力（デフォルト `.`、`_` / `-` / `/` に変更可能）
4. Strategy を選択：単一配列は「Single」、複数配列フィールドは「Multi」で自動分割、強制分割は「Split」
5. スタイルオプションをチェック：Sort columns（列ソート）、Beautify keys（キー名整形）、Exclude empty（空列除外）、Include Caption（見出し）、Include Index（行インデックス）
6. 配置方法を選択：左揃え / 中央揃え / 右揃え
7. 「Convert」ボタンをクリック（または直接Enterキー）で変換を実行；入力時は500msのデバウンス保護あり
8. 右側で生成されたMarkdownテーブルコードを確認し、満足したら「Copy」をクリックしてコードをコピーしMarkdownドキュメントに貼り付けるか、「Download」をクリックして table.md ファイルとしてダウンロード

特徴

• ネストオブジェクト自動フラット化：`{user:{name,age}}` を `user.name`、`user.age` のようなドット記法キー名に再帰展開（深度1〜6段階調整可能）、手書きフラット化スクリプト不要
• 4種のネスト処理モード：フラット化（推奨、深度調整可能）/ 第1層キー（ネストオブジェクトを単一列JSONとして）/ 文字列化（ネストオブジェクトをJSON文字列に変換）/ Raw JSON（行ごとに完全なJSONブロック）
• スマートマルチテーブル分割：JSONトップレベル配列フィールド（`users`、`orders` など）を認識し、自動的に複数の独立したMarkdownテーブルに分割し ### 見出しを生成、複雑な業務データに最適
• カスタム区切り文字：フラット化モードのデフォルトは `.`（`user.name`、Lodash / MongoDB規約に準拠）、ツールバーで `_` / `-` / `/` などにカスタマイズ可能
• キー名整形（camelCase / snake_case → Title Case）：`user_name` を自動で `User Name` に、`userProfileId` を自動で `User Profile Id` に変換、ヘッダーを人間が読みやすく
• 列ソートスイッチ：ワンクリックですべてのヘッダー列をアルファベット順に並べ替え、複数のMarkdownドキュメント間で列順を安定させて比較可能に
• 空値列除外：全行が null / undefined / 空文字列の列を自動検出して除外、無意味な列の占有を防止
• 3種の配置方法：左揃え（`:-`）/ 中央揃え（`:-:`）/ 右揃え（`-:`）、ラジオボタン切替、GFM仕様準拠
• 行インデックス列スイッチ：左端に `#` 番号列を追加可能（ヘッダーテキストカスタマイズ可能）、ドキュメント内で行番号を参照しやすく
• Caption 見出しスイッチ：各テーブルの上に `### データ名` 3段階見出し（H3）を自動生成、章立てドキュメントで構造が明確、SEOにも貢献
• 型認識エスケープ：セル内の `|` / `\` / 改行文字を自動で `\|` / `\\` / `<br>` にエスケープ、Markdownテーブル構文の破壊を防止
• 生成統計フィードバック：下部ステータスバーに「N個のテーブル × M行 × K列を生成」+ バイト数をリアルタイム表示、長大なJSONのデバッグ時にデータ規模が一目瞭然
• サンプルデータ + ファイルアップロード：3件のネストユーザーサンプルをワンクリックで読み込み、ドラッグ＆ドロップまたはクリックで .json / .txt ファイルをアップロード可能
• 完全ブラウザローカル処理：すべてのJSON解析、ネストフラット化、Markdown生成、コピー・ダウンロード操作がブラウザ内で完結、データはサーバーに一切アップロードされない

コード例

// 1) GitHub API を呼び出してユーザーリストを取得
async function fetchUsers() {
  const res = await fetch('https://api.github.com/users?per_page=10');
  return await res.json();
}

// 2) ネストフラット化関数（本ツールのフラット化ロジックと同等）
function flattenObject(obj, prefix = '', sep = '.', result = {}, depth = 0, maxDepth = 3) {
  if (!obj || typeof obj !== 'object' || Array.isArray(obj)) return result;
  if (depth >= maxDepth) {
    if (prefix) result[prefix] = JSON.stringify(obj);
    return result;
  }
  for (const [k, v] of Object.entries(obj)) {
    const key = prefix ? `${prefix}${sep}${k}` : k;
    if (v && typeof v === 'object' && !Array.isArray(v)) {
      flattenObject(v, key, sep, result, depth + 1, maxDepth);
    } else {
      result[key] = v;
    }
  }
  return result;
}

// 3) フラット化したデータを Markdown テーブルに変換
function generateMarkdownTable(rows, opts = {}) {
  const { align = 'left', includeIndex = false, sortColumns = false } = opts;
  const flat = rows.map(r => flattenObject(r));
  let cols = [...new Set(flat.flatMap(r => Object.keys(r)))];
  if (sortColumns) cols.sort((a, b) => a.localeCompare(b));

  const alignMap = { left: ':-', center: ':-:', right: '-:' };
  const alignSep = alignMap[align];

  const headers = includeIndex ? ['#', ...cols] : cols;
  const seps = includeIndex ? [alignSep, ...cols.map(() => alignSep)] : cols.map(() => alignSep);

  const escapeCell = v =>
    v == null ? '' :
    typeof v === 'object' ? JSON.stringify(v).slice(0, 60) :
    String(v).replace(/\\|/g, '\\|').replace(/\n/g, '<br>');

  const lines = [];
  lines.push('| ' + headers.join(' | ') + ' |');
  lines.push('| ' + seps.join(' | ') + ' |');
  flat.forEach((r, i) => {
    const idxCell = includeIndex ? [i + 1] : [];
    const cells = cols.map(c => escapeCell(r[c]));
    lines.push('| ' + [...idxCell, ...cells].join(' | ') + ' |');
  });
  return lines.join('\n');
}

// 4) README.md に出力
const users = await fetchUsers();
const md = generateMarkdownTable(... [truncated]

from flask import Flask, jsonify
import json

app = Flask(__name__)

def flatten(obj, prefix='', sep='.', result=None, depth=0, max_depth=3):
    """ネストオブジェクトを再帰的にフラット化"""
    if result is None:
        result = {}
    if not isinstance(obj, dict) or depth >= max_depth:
        if prefix:
            result[prefix] = json.dumps(obj) if isinstance(obj, (dict, list)) else obj
        return result
    for k, v in obj.items():
        key = f"{prefix}{sep}{k}" if prefix else k
        if isinstance(v, dict):
            flatten(v, key, sep, result, depth + 1, max_depth)
        else:
            result[key] = v
    return result

def json_to_markdown_table(data, align='left', include_index=False,
                            sort_columns=False, caption=None):
    if isinstance(data, dict):
        data = [data]
    if not data:
        return "<!-- No valid objects found -->"

    flat_rows = [flatten(row) for row in data]
    columns = []
    for row in flat_rows:
        for k in row:
            if k not in columns:
                columns.append(k)
    if sort_columns:
        columns.sort()

    align_sep = {'left': ':-', 'center': ':-:', 'right': '-:'}[align]
    headers = (['#'] if include_index else []) + columns
    seps = ([align_sep] if include_index else []) + [align_sep] * len(columns)

    def escape_cell(v):
        if v is None:
            return ''
        if isinstance(v, (dict, list)):
            s = json.dumps(v)
            return s[:60] + '…' if len(s) > 60 else s
        return str(v).replace('|', '\\|').replace('\n', '<br>')

    lines = []
    if caption:
        lines.append(f'### {caption}\n')
    lines.append('| ' + ' | '.join(headers) + ' |')
    lines.append('| ' + ' | '.join(seps) + ' |')
    for i, row in enumerate(flat_rows):
        idx_cell = [str(i + 1)] if include_index else []
        cells = [escape_cell(row.get(c, '')) for c in columns]
        lines.appe... [truncated]

# 1) gh CLI で直近 50 件の merged PR を取得
PR_JSON=$(gh pr list --state merged --limit 50 --json number,title,author,labels,mergedAt)

# 2) jq で labels ネスト配列をフラット化（本ツールのフラット化ロジックと同等）
echo "$PR_JSON" | jq 'map({
  number: .number,
  title: .title,
  author: .author.login,
  labels: (.labels | map(.name) | join(", ")),
  mergedAt: .mergedAt
})' > release_prs.json

# 3) 本ツール (https://geekformat.com/json/to-markdown/) を開く
#    - release_prs.json の内容を貼り付け
#    - ツールバー Strategy で "Single" を選択
#    - Sort columns + Include Index をチェック
#    - Convert をクリック
#    - 生成された Markdown テーブルをコピー

# 4) Release Notes に結合
cat > RELEASE.md <<'EOF'
# v2.1.0 Release Notes

## 🆕 What's Changed

EOF

# 前の手順でコピーしたテーブルをここに貼り付け（または sed で注入）
sed -i '/## 🆕/r /tmp/table.md' RELEASE.md

cat >> RELEASE.md <<'EOF'

**Full Changelog**: https://github.com/your/repo/compare/v2.0.0...v2.1.0
EOF

# 5) gh CLI で Release を作成
gh release create v2.1.0 -F RELEASE.md -t "v2.1.0"

よくある質問

トラブルシューティング

用語集

Markdown テーブル

| と - 文字で構成される純粋テキストテーブルで、GFM（GitHub Flavored Markdown）仕様で定義されています。本ツールが生成するコードはこの構文に厳密に従い、GitHub / GitLab / Notion / Confluence で直接レンダリング可能です。

GFM

GitHub Flavored Markdown の略称で、GitHubが標準Markdownの上に拡張した方言で、テーブル、取り消し線、タスクリスト、自動リンクなどが含まれます。本ツールが生成するテーブルはGFM仕様に準拠しています。

CommonMark

Markdown記法の標準化仕様（2014年発表）。GFMテーブル構文はCommonMarkの上に拡張されています。本ツールの出力は厳密なCommonMarkパーサーとGFMパーサーの両方で正しくレンダリング可能です。

JSON 配列

角括弧 [...] で囲まれたオブジェクトの集合。本ツールは配列の各オブジェクトをテーブルの1行として扱います。空配列の場合はテーブルを生成しません（ヒントを表示）。

JSON オブジェクト

波括弧 {} で囲まれたキーと値のペアの集合。本ツールはオブジェクトの各キーをヘッダー、値をセルとして扱います。単一オブジェクトは自動的に単一行テーブルにラップされます。

ネストフラット化 (Flatten)

ネストオブジェクトをドット区切りのフラットなキー名に再帰展開すること。例：{user:{name:'A'}} → 'user.name'。本ツールは1〜6層の深度自動フラット化をサポートし、区切り文字を設定可能です。

キー名整形 (Beautify Keys)

snake_case または camelCase のキー名を Title Case に変換するルール：user_name → User Name、userProfileId → User Profile Id。本ツールの差別化能力の1つです。

スマートマルチテーブル分割 (Multi-Table Split)

JSONのトップレベル配列フィールド（users、orders など）を認識し、自動的に複数の独立したMarkdownテーブルに分割すること。本ツールの差別化能力の1つで、分割された各テーブルに自動的に ### 見出しが生成されます。

配置構文 (Alignment)

GFMテーブルのヘッダー区切り行は : 文字による配置制御をサポート：:- 左揃え、:-: 中央揃え、-: 右揃え。本ツールは3つのボタンでワンクリック切替を提供します。

行インデックス列 (Index Column)

テーブルの左端に追加される # 番号列（1から始まるインクリメント）、ヘッダーテキストはカスタマイズ可能です。本ツールはデフォルトでオフ、オンにするとドキュメント内で行番号を参照しやすくなります。

Caption

Markdownにおける H3 3段階見出し（###）。本ツールは生成された各テーブルの上に自動的にこのラベルを追加します（デフォルトではトップレベル配列フィールド名またはユーザーカスタムテキストを使用）。ドキュメントナビゲーションとSEOの両方に役立ちます。

列ソート (Sort Columns)

テーブルのすべての列をアルファベット順に並べ替えるスイッチ。オンにすると、複数ドキュメントを比較する際に列順が安定して一貫し、diff ツールで見られる変更が識別しやすくなります。

空列除外 (Exclude Empty)

全行において特定の列がすべて null / undefined / 空文字列であることを検出した場合、その列を自動的に除外します。本ツールはデフォルトでオフ、オンにするとスパースデータのテーブル幅を大幅に削減します。

Markdown エスケープ (Escape)

Markdownテーブル内で特別な意味を持つ文字（|、\、改行など）を安全な形式（\|、\\、<br>）に変換し、テーブル構文の破壊を防ぐこと。本ツールはこのエスケープを自動的に行い、競合ツールに対する重要なアップグレードです。

ローカル履歴 (localStorage)

ブラウザが提供するローカルキー・バリューストレージ（容量約5〜10MB）。本ツールは localStorage を使用して最近の入力を永続化し、更新や誤ってページを閉じた後でも素早く復旧できます。

デバウンス (Debounce)

フロントエンドのパフォーマンス最適化技法：高頻度イベント（入力など）のコールバックを最後のトリガー後に1回だけ実行するように統合します。本ツールは500msのデバウンスを設定し、大きなファイル解析時のラグを防止します。

4種のネストオブジェクト処理モード比較表

ツールバーは異なるネストシナリオに対応する4種のモードを提供します。JSON構造の複雑さに応じて選択することをお勧めします：

3種のテーブル生成戦略比較表

ツールバーの Strategy ドロップダウンは、複数の配列フィールドを含むJSONの処理方法を制御します：

ツールバー 14項目の設定可能オプション早見表

ツールバーの全14項目の設定可能オプションとその効果。組み合わせを素早く選択するために：

Markdown セルエスケープルール早見表

ツールはセル内のテーブル意味を破壊する可能性のある特殊文字を自動的にエスケープします：

Privacy & Security

本 JSON から Markdown 変換ツールのすべての JSON 解析、ネストフラット化、Markdown 生成、コピー・ダウンロード操作は完全にブラウザローカルで JavaScript によって実行され、入力された JSON データと生成された Markdown コードはどのサーバーにもアップロードされず、記録、キャッシュ、クラウド保存されることもありません。未公開APIのレスポンスや内部業務フィールドを含む機密JSONも安心して使用でき、ページを閉じれば全データが消去されます。

Authoritative References

• GitHubGitHub Flavored Markdown 仕様 - テーブル (Tables)
• CommonMarkCommonMark 仕様
• MarkdownMarkdown 公式ドキュメント (Daring Fireball)
• MDNMDN - JSON.parse / JSON.stringify
• GitHubGitHub Docs - Markdown での情報整理
• LodashLodash - flatten / flattenDeep
• jqjq マニュアル - ネストオブジェクト処理