Web開発
Fancy Curl Sites
要約
著者は、コマンドラインツールであるcurlで閲覧できるウェブサイトのバージョンを作成しました。これは、ANSIエスケープコードを使用してターミナルで表示されるように設計されており、他の人のアイデアに触発されたものです。著者は、自身のカスタムマークアップ言語と静的サイトジェネレーターが、この機能の実現を容易にしたと説明しています。
全文翻訳
Fancy Curl Sites 2026年3月18日(更新: 2026年10月14日) かなり前に、ターミナルでの表示を意図した、私のサイトの楽しいcurlバージョンを追加しました。これらのコマンドを実行してみてください!
curl nytpu.com/gemlog/2026-03-18 # または curl nytpu.com (Windowsユーザーはごめんなさい、cmd.exeでANSIエスケープコードがデフォルトで無効になっているのは私のせいではありません。また、Powershellではcurl.exeを使用しなければならないのは私のせいではありません。なぜならPowershellは不可解にもそれをInvoke-WebRequestにエイリアスしているからです。)
Fediverseで少し投稿しましたが、それ以外はあまり詳しく説明しませんでした。なぜなら、それはかなり自明だと思ったからです。しかし、何人かの人々からどのように行ったのか尋ねられたので、実際にどのように行ったのかについての投稿を書く価値があるかもしれないと思いました(…約7ヶ月遅れで)。
このアイデアは、trinkey(curl trinkey.com)とstrongsand(curl proot.party)のcurlサイトから来たと注記しておきます。私は自分で思いついたわけではありません。彼らとはかなり異なる方法で行いましたが、この非常にクールなアイデアのすべての功績は彼らにあります。(更新: 残念ながら、2026年10月14日現在、彼らのcurlバージョンはどちらも機能していません。)
まず、より興味深い部分ですが、クライアントに送信するANSIマークアップ済みのファイルを実際に生成することです。インデックスページとアバウトページは完全に手書きしました。trinkeyとstrongsandはおそらくratatuiライブラリ(または類似のもの)でオンザフライで生成していると思いますが、それはおそらくより便利です。しかし、手書きの方が私にはより迅速に思えました。Vimのレジスタにメインのエスケープコード—ESC[、つまり\x1b[—1を保存しておき、必要に応じて簡単に貼り付けられるようにしました。そして、メイングラフィックスコードのWikipediaページを開いて、特定のエスケープコードを参照しました。そして、まあ、それだけです。私は好みの整合性のあるスタイリングを決定するために実験し、マークアップされたcurlページを作成する際に、私のページのGopherバージョンを参照しました。
私のバージョンで注目すべき点は、単に1つか2つのページが利用可能であるだけでなく、ブログ全体をcurlバージョンで提供していることです。これは、都合の良い偶然のおかげです。4年以上前に、私がブログで使用しているカスタムマークアップ言語であるGemroffで、ANSIマークアップ済みのプレーンテキストを出力するように実装しました。元々は、執筆中にターミナルで下書きを便利にプレビューできるようにするためだけでしたが、それを静的サイトジェネレーターに組み込むことで、curlバージョンをすぐに生成できるようになりました。ブログ投稿用のラッパーテンプレートと、投稿をリストするインデックスページ用のテンプレートを手動で作成しましたが、それと静的サイトジェネレーターの数行の追加で、配線に必要なすべてでした。
これが、それが簡単だと言いにくい主な理由です!なぜなら、それは私が完全にカスタムマークアップ言語と静的サイトジェネレーターを使用しており、何年も前に正しい設計上の選択をしたという幸運があったからにすぎません—例えば、私のSSGは、他のSSGがHTMLのみをサポートするのとは対照的に、HTTP、Gemini、Gopherでサイトをトリプルホストしているため、複数のモジュラー出力形式をすでにサポートしていました。
しかし、数ページを手書きで提供するだけで、このようなサイトをセットアップすることは、単にクールなギミックであり、誰も数分以上のブラウジングには実際には使用しない可能性が高いので、それでも完全に許容できる方法です。
最後に、最後のステップは、curlを含む任意のユーザーエージェントにCurlバージョンを実際に提示することです。私にとっては、Nginxの設定にいくつかの変更を加えるだけで済みました。他のサーバーでも同様に簡単でしょう。私が望んだ主な機能は、オーバーライドヘッダー(X-Original: true)でした。これにより、curlを実行しているカジュアルなユーザーが望むであろう未変更のHTTP応答を引き続き取得でき、すべてを静的に提供したいと思っていました。
そして…それがすべてです!前述のように、最初にセットアップしたときは自分にとってはかなり自明に思えましたが、ウェブサーバーまたはANSIエスケープコードのいずれかで人々が通常行うこととは非常に非直交的であるため、人々の好奇心/混乱がどこから来たのかは理解できます。このトリックを実践するサイトがもっと増えるといいですね。
EMDASH!AI生成!実際には、私のマークアップ言語には2022年11月からダッシュ(emdash)の明示的なマークアップ要素があったことをお知らせします。そして、信じようと信じまいと:LLMは実際の著者からコピーされたものに基づいてトレーニングされているため、LLMは人間が書いた作品ですでに使用されているのでなければ、ダッシュを使用しないでしょう。そして、私が段落ごとに20個の括弧を使用し、バリエーションのためにダッシュを使用したいと感じるような状況を避けるべきですか?考えられない!↩︎