oka-project since 2024 お問い合わせ
TOPブログ / 技術

Markdownをブラウザだけでプレビューする方法(インストール不要)

2026.08.28 公開 2026.08.27 更新 技術 約6分で読めます

Markdownを確認するだけなら、必ずしもエディタのインストールは必要ありません。ブラウザ・GitHub・ローカルエディタの使い分けと、ファイルを外部送信せず確認する方法を整理します。

Markdownの見た目を確認したいだけなら、必ずしも専用アプリやエディタを入れる必要はありません。

特に、借りたPCやインストール権限のない端末では、ブラウザだけで確認できる方法を知っておくと便利です。ただし、「オンラインで使える」ことと「ファイルをサーバーへ送信しない」ことは同じではありません。

この記事では、Markdownを確認する代表的な方法と、使い分けの基準を整理します。

先に結論:単発の確認ならブラウザ型Viewerが手軽

一度だけMarkdownの見た目を確認したいなら、ブラウザ型のMarkdown Viewerを使う方法が手軽です。継続的に編集するならローカルエディタ、GitHubへ公開するREADMEならGitHub自身の表示を最終確認に使う、と用途で分けると迷いません。

oka-projectのMarkdown Viewerは、.mdファイルやMarkdownテキストをブラウザ上でプレビューできる無料・登録不要のツールです。入力したテキストやファイルはブラウザ内で処理し、サーバーへ送信・保存しない構成にしています。手元のMarkdownをインストールなしで一度確認したい場面に向いています。

Markdownをプレビューする3つの方法

1. ブラウザだけで確認する

一番手軽なのは、Markdownをブラウザ上で読み込んで表示する方法です。

Markdown Viewerでは、mdファイルを選ぶかテキストを入力すると、その場でプレビューできます。インストールは不要です。

この方式が向いているのは、次のような場面です。

  • 一度だけmdファイルを確認したい
  • インストール権限がないPCを使っている
  • READMEやメモの表示崩れを素早く見たい
  • ファイルをアップロードする方式を避けたい

ブラウザには、ユーザーが選んだローカルファイルをJavaScriptから読み込むためのFile APIがあります。たとえば FileReader.readAsText() を使えば、選択したFileやBlobを文字列としてブラウザ内で読み取れます。

ただし、ブラウザで動くツールが必ずローカル処理とは限りません。読み込んだ内容をAPIへ送信する実装も可能なので、重要なファイルを扱う場合は、ツール側の説明や通信状況まで確認する必要があります。

2. GitHub上で確認する

GitHubに置くREADMEなどは、GitHub自身の表示で確認するのが最も確実です。

GitHubはGitHub Flavored Markdown(GFM)を使っており、見出し・表・タスクリストなどを独自のルールを含めてレンダリングします。そのため、別のMarkdownビューアで問題なく見えても、GitHub上では細部が異なることがあります。

最終公開先が決まっている場合は、その環境のプレビューを最終確認に使うのが基本です。

3. ローカルのエディタを使う

日常的にMarkdownを書くなら、エディタにプレビュー機能を持たせる方法が効率的です。

編集と確認を何度も往復する場合は、この方法が一番向いています。一方で、「手元にある1ファイルを見るだけ」のために環境を整えるのは手間になります。

つまり、どれが優れているかではなく、用途が違います。

方法 向いている場面 注意点
ブラウザ型 単発確認、共有PC、インストール不可 サーバー送信の有無を確認する
GitHub GitHubで公開するREADMEの最終確認 リポジトリへ置く必要がある
ローカルエディタ 継続的な執筆・編集 初期セットアップが必要

ブラウザだけで確認する手順

Markdown Viewerを使う場合は、操作は3段階です。

  1. Markdown Viewer を開く
  2. mdファイルを選ぶ、またはMarkdownテキストを入力する
  3. プレビュー表示で見た目を確認する

必要ならソース表示へ切り替えたり、レンダリング後のHTMLをコピーしたり、印刷機能からPDFとして保存したりできます。

Markdownは「どこでも同じ表示」ではない

Markdownには複数の実装があります。CommonMarkはMarkdownの曖昧さを減らすための仕様を定めていますが、GitHubのGFMのように拡張構文を持つ環境もあります。

そのため、プレビュー時に特に確認したいのは次の項目です。

  • タスクリスト
  • 改行
  • コードブロック
  • 外部画像
  • HTMLを直接書いた部分

「Markdownとして正しいか」と「公開先で意図どおり見えるか」は分けて考えたほうが安全です。

ファイルを外へ出したくない場合の確認ポイント

オンラインツールを使うときは、UIだけで判断せず、少なくとも次の点を確認します。

  • ファイルをサーバーへアップロードする方式か
  • 読み込み後にAPI通信が発生するか
  • 外部画像や外部リソースを自動取得するか
  • プライバシーポリシーに保存期間が書かれているか

oka-projectのMarkdown Viewerは、入力内容をブラウザ内で処理し、外向き通信をCSPで制限しています。設計の詳細は ブラウザ完結ツールの「送信しない」を、約束ではなく構造にする にまとめています。

目的が決まっている場合は専用手順へ

結論:単発の確認ならブラウザ、最終確認は公開先

一度だけMarkdownを確認するなら、ブラウザ完結のビューアは手軽です。継続的に編集するならエディタ、GitHubに公開するならGitHub自身の表示を最終確認に使う、と分けると迷いません。

重要なのは、「オンラインだから便利」だけでなく、「どこで処理されるか」まで含めて選ぶことです。

Markdown Viewerを使う

参考

#Markdown#プレビュー#ブラウザ完結#セキュリティ
← ブログ一覧へ