Markdown とドキュメントのツール
Markdown プレビュー、Markdown ↔ HTML 変換、目次生成、SQL 整形、HTML プレビューなど。
README、技術ブログ、ドキュメントサイトなど、Markdown ベースの文書作成は今や標準的なワークフローです。本セクションは、書きながら見た目を確認したい場面、既存の HTML を Markdown に取り込みたい場面、長い記事の目次を機械的に生成したい場面、SQL クエリを共有用に整形したい場面など、ドキュメント作業全般のユーティリティをまとめています。
このジャンルのツール(9)
Markdownプレビュー
Markdownテキストをリアルタイムでプレビュー・レンダリング
Markdown→HTML変換
MarkdownをHTMLコードに変換(GFM対応・整形/ミニファイ切替)
HTML→Markdown変換
HTMLをMarkdownに変換(見出し・リスト・表・リンク・画像・コードに対応)
Markdown 目次(TOC)ジェネレーター
Markdown の見出しから GitHub 形式アンカー付きの目次を自動生成
Markdown テーブル生成(Excel / TSV / CSV から)
タブ区切りや CSV データを Markdown テーブルに変換。列の整列指定にも対応
HTMLプレビュー
HTMLコードをサンドボックス化されたiframeでリアルタイムプレビュー
HTMLフォーマッタ
圧縮された HTML や 1 行の HTML をインデント付きで読みやすく整形
HTML ミニファイア(圧縮)
HTML から空白・改行・コメントを削除して最小化。<pre> や <script> の中身は保持
SQLフォーマッター
SQLクエリをカスタマイズ可能なインデントとキーワードケースで整形
関連する記事
-
Markdown のリンクスタイル比較:inline / reference / shortcut / autolink の使い分け
Markdown には 4 種類のリンク記法があり、可読性・再利用・URL 長・自動解析の観点で長短があります。inline link、reference link、shortcut reference、autolink の違いと、ドキュメント・記事・README で何を使うべきかを整理します。
-
Markdown と HTML を相互変換するときの注意点(GFM、サニタイズ、属性保持)
Markdown を HTML に変換するとき、HTML を Markdown に戻すときに失われる情報、GFM 拡張の互換性、サニタイズの必要性、画像や表の挙動を整理します。
-
Mermaid 記法入門:Markdown に図を埋め込む 7 種類の図
Mermaid のフローチャート、シーケンス図、ガント、ER 図、状態遷移、クラス図、円グラフの基本記法。GitHub・Notion・Obsidian で使える図示記法を整理します。
-
Markdown の方言:CommonMark と GFM、その他の拡張
Markdown には CommonMark、GitHub Flavored Markdown、各種ツール独自の拡張があります。違いと互換性、よくある罠を整理します。
-
SQL 整形ルール:可読性を上げるインデントと改行のスタイル
SQL を読みやすく整形する基本ルール、ANSI 形式と縦並びキーワード形式の違い、JOIN や条件式のインデント方針を整理します。
-
Markdown の目次とアンカー:GitHub 形式のスラッグ生成と落とし穴
長い記事に目次を入れるべき理由、Markdown のアンカーリンク(`[text](#anchor)`)が GitHub Flavored Markdown でどう生成されるか、目次自動生成のロジックと実装上の罠を整理します。