1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

chrome拡張機能「Github Html Preview」のAPIサーバとプレビューサーバをセルフデプロイできるようにしてみた

Last updated at Posted at 2025-12-20

GitHubの「プライベート」のHTMLドキュメントをそのままプレビューしたい!

私は「かんたんMarkDown」を好きで使っています。
ローカル環境で書き出しておいて確定したものをGitHubにアップロードしてそのまま手順書にしたいのです。
当然GitHub上で直接MDファイル作れば良いのでは?という事ですが、
そのままHTMLファイルだけ配布すれば誰でも読める「かんたんMarkDown」は使い勝手が良く。
しかし、、GitHub上ではそのままではHTMLをプレビューしてくれないので、
利用したいときや修正があるときはダウンロードして修正し再度アップロードしていました。
いよいよこれは効率が悪いな。。と。

なんかないかな?と探してみた

そんな中、chrome拡張機能に「Github Html Preview」というのがリリースされていることを知り、プライベートでもトークンを入力すると使えたので、お!これは良さそうだなと思ったわけです。
(作者さんの使い方Youtube)

そういえば・・・トークンは何処に送られている??

まさにそれを指摘されている方も居ました。

Security Review - Stores Private Repo Keys on remote server.png

Tokens are sent to a 3rd Party: To preview private repositories, the extension requires you to generate a GitHub Personal Access Token. Analysis of the extension's permissions shows it communicates with https://github-html-preview.dohyeon5626.com.

・・・まあ、確かに良さそうでは無いですよね。。
(速攻使ったトークンは削除しました。。)

フォークさせてもらいAPIサーバとプレビューサーバをセルフデプロイできるようにしてみた

ここでバイブコーディング
独自サーバ用のenvファイルを準備しておいて、APIサーバとプレビューサーバをDockerで構築できるようにしてもらいました。
(結局 Gemini 3 が強いか。)

「Pull requests」のトライ&エラー4回で想定した動作をしました

Pull requests4回でFIX.png

  • PublicリポジトリのHTMLファイルのプレビュー
  • Privateリポジトリのトークンを入力してHTMLファイルのプレビュー
  • Privateリポジトリの日本語名HTMLファイルのプレビュー

以上です。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?