ある人から、MarkdownのテキストをPDFにしてくれる何かが欲しいと言われたので、Claude Codeで作る事にした

ais

11 May 2026 — 2 min read

実際、AIはMarkdownで解答を返してくる事が多く、普通に使っているだけでも、Markdown形式のテキストが手軽に表示したり、PDFに変換できると便利だと思うので、ブラウザで手軽に使える物を作りました。

作成後WEB上にアップしたのが以下のURLになります。
https://test.aisgm.me/test_prog/app/md2pdf/

VS Codeのプラグイン入れれば、同じ事は出来ますし、他にも同じようなアプリを作っている人がいるので、それを使うのも手なんですが、最近は怪しいサイトも多いですし、広告が大量に出るものも多いです。
更に、プラグインがウィルスに汚染されているケースなんかもニュースになっているので、セキュリティー的に使った事が無いものを人に勧めるのも怖いです。

そんな訳で、手軽に使えてインストール等の面倒な準備が必要無いってなると、WEBアプリでアクセスすれば使えて、ローカルで処理させるのが良さそうです。
配布やインストールの手間も必要無く、使いたい時にネットに繋がって、ブラウザさえあれば動くので一番使い勝手がいいですよね。

ってな訳で、Claude Codeでサクッと作る事にしました。
この手の話はいくらでもあるので、今のClaude4.6 Sonnetで小物のWEBアプリを作るのには、どの程度の時間で出来るのか、参考になればと思います。

プロンプトは以下の単純で曖昧なプロンプトです

MarkdownテキストをPDFに変換するWEBアプリを制作してください
MarkdownテキストはMarkdownテキストをコピペするか、テキストファイルをドラッグ＆ドロップ出来るようにしてください。

Claude Codeはこのぐらいのプロンプトで十分作ってくれます。
で、待つ事数分でできあがります。普通にブラウザから作成されたHTMLを開いて、Markdownファイルを見てみると、表記がおかしい部分があったりPDF変換しても空のPDFが作成されるので、その点を指摘します。
次のようなプロンプトで修正依頼します。

実行結果、中身の無いPDFが作成されました。調査してください
実行した結果がMarkdown.pdfです。ルートフォルダに置きました。
「- **aa**」の解釈が正しく出来ていないようです。
Markdownでは「・aa」となりaaが強調された文字となりますが、
「・[object Object]」と表示されてしまいます。調査してください

具体的に問題点を指摘する事と、画像やPDF等を指定して問題を認識させる事が修正への近道かなと思います。
このような感じで、他にも細かい点や、生成したPDFの中からテキストを直接選択・コピーできる形式に変換する機能を追加してもらいました。

とりあえず、意図したとおりに動くようになるのが30分程度で、今の形になったのが、その後15分程度です。