📝 Markdown Preview
markdown を入力してリアルタイムに HTML レンダリングを即座に確認できます。
このツールとは?
Markdown Preview ツールは、markdown をリアルタイムで HTML にレンダリングする無料オンライン markdown エディターです。左側に入力すると、右側にフォーマットされた結果が即座に表示されます。README ファイル、ブログ記事、ドキュメント、その他の markdown コンテンツを公開前にプレビューするのに最適です。 Markdown は、プレーンテキストの書式設定を使用して構造化ドキュメントを作成する軽量マークアップ言語です。2004 年に John Gruber によって、ウェブ向けの執筆をできる限り簡単にするために作成されました。markdown を使えば、見出し、太字や斜体のテキスト、リスト、リンク、画像、コードブロック、テーブルなどを、すべてシンプルなテキスト記号で作成できます。markdown はあらゆる場所で使われています。GitHub の README、Reddit のコメント、Discord のメッセージ、ドキュメントサイト、多くのコンテンツ管理システムなどです。 このプレビューアーは、タスクリスト、取り消し線、コードシンタックスハイライトなどの GitHub Flavored Markdown (GFM) 拡張を含む、標準的な markdown 構文をサポートしています。すべてはブラウザー内で完全に実行されるため、コンテンツがサーバーにアップロードされることはありません。下書きが完全にプライベートであることを確信して執筆できます。仕組み
このツールは JavaScript の markdown パーサーを使用して、テキストをリアルタイムで HTML に変換します。エディターパネルで入力すると、パーサーが markdown 構文を文字ごとに処理し、対応する HTML 要素を生成してプレビューパネルに表示します。 パーサーはすべての標準的な markdown 要素を処理します。見出し(# から ######)、太字(**text**)、斜体(*text*)、リンク([text](url))、画像()、順序なしリスト(- または *)、順序付きリスト(1.)、コードブロック(```)、インラインコード(`code`)、引用(>)、水平線(---)、テーブルなどです。また、GitHub Flavored Markdown 拡張もサポートしています。タスクリスト(- [x])、取り消し線(~~text~~)、自動 URL リンク付けなどです。 レンダリングは完全にクライアント側で行われるため、サーバーへの通信は発生しません。markdown パーサーは十分にテストされた JavaScript ライブラリであり、ネストされたリスト、リスト項目内の複数段落、リスト内のコードブロックなどのエッジケースを処理します。プレビューはキーストロークごとに更新され、真のライブ編集体験を提供します。使い方
- 左側のエディターに markdown を入力または貼り付けます。
- 右側にフォーマットされた HTML プレビューがリアルタイムで更新されるのを確認します。
- 標準的な markdown 構文(# 見出し、**太字**、*斜体* など)を使用します。
- GitHub Flavored Markdown を試しましょう。タスクリスト、テーブル、取り消し線などです。
- 必要に応じてレンダリングされた HTML または markdown ソースをコピーします。
よくある質問
よくある質問
どの markdown 構文に対応していますか?
標準 markdown(見出し、太字、斜体、リスト、リンク、画像、コード、引用、テーブル)に加えて、GitHub Flavored Markdown 拡張(タスクリスト、取り消し線、自動リンク、コードシンタックスハイライト)に対応しています。
markdown コンテンツはサーバーに送信されますか?
いいえ。すべての処理は JavaScript を使用してブラウザー内で行われます。コンテンツがデバイスから離れることはなく、下書きやメモの完全なプライバシーが保証されます。
GitHub の README ファイルに使用できますか?
はい。このプレビューアーは GitHub で使用されているのと同じ方言である GitHub Flavored Markdown をサポートしています。タスクリスト、テーブル、取り消し線、コードブロックは GitHub と同じようにレンダリングされます。
markdown でテーブルを作成するにはどうすればよいですか?
パイプ(|)で列を区切り、ヘッダー行にハイフン(-)を使用します。例: | Header 1 | Header 2 | \n|---|---| \n| Cell 1 | Cell 2 |
ヒントとアドバイス
Markdown は、レンダリング前でもプレーンテキストとして読みやすいように設計されています。見出し(#)を使ってドキュメント構造を作成し、見出しレベルを一貫させましょう。コードブロックでは、トリプルバッククォートの後に言語を指定(```python)するとシンタックスハイライトが有効になります。テーブルを作成する際は、パイプを垂直に揃えると読みやすくなります。タスクリスト(- [x] 完了、- [ ] 未完了)は README のプロジェクト追跡に最適です。GitHub 向けに執筆する場合は、ここで markdown を事前にプレビューして、プッシュ前にフォーマットの問題を見つけましょう。長いドキュメントにはアンカーリンクを含む目次を使用しましょう。行末にスペースを 2 つ入れると、markdown でハード改行が作成されることに注意してください。