feat(blog/content): update post /posts/2025-01-08/phperkaigi-2023-tokens-q1/

1 files changed, 34 insertions, 19 deletions

diff --git a/vhosts/blog/content/posts/2025-01-08/phperkaigi-2023-tokens-q1.ndoc b/vhosts/blog/content/posts/2025-01-08/phperkaigi-2023-tokens-q1.ndoc
index 82747627..37345849 100644
--- a/vhosts/blog/content/posts/2025-01-08/phperkaigi-2023-tokens-q1.ndoc
+++ b/vhosts/blog/content/posts/2025-01-08/phperkaigi-2023-tokens-q1.ndoc
@@ -13,6 +13,10 @@ tags = [
 [[article.revisions]]
 date = "2025-01-08"
 remark = "公開"
+
+[[article.revisions]]
+date = "2025-01-11"
+remark = "読みやすさのため一部の文言を調整"
 ---
 <article>
   <section id="intro">
@@ -21,14 +25,16 @@ remark = "公開"
       これは PHPerKaigi 2023 の記事です。今は 2025 年ですが、PHPerKaigi 2023 の記事です。
     </note>
     <p>
-      2023-03-23 から 2023-03-25 にかけて開催された <a href="https://phperkaigi.jp/2023/">PHPerKaigi 2023</a> では、弊社デジタルサーカス株式会社からトークン問題を出題した。
-      「トークン問題」とは、PHPerKaigi 2023 でおこなわれた PHPer チャレンジと呼ばれる企画で使われたもので、この記事で説明するような問題を解くと、「PHPer トークン」と呼ばれる「#」から始まる文字列を得ることができる。参加者がこのトークンを集めると、景品などが得られるという仕組みである。
+      2023-03-23 から 2023-03-25 にかけて開催された <a href="https://phperkaigi.jp/2023/">PHPerKaigi 2023</a> では、PHPer チャレンジという企画がおこなわれた。
+      PHPer チャレンジとは、スポンサーのパンフレットやカンファレンス会場などから「#」記号で始まる文字列を集め、景品などを得るという企画である。
+      この文字列は「PHPer トークン」と呼ばれている。弊社<a href="https://www.dgcircus.com/">デジタルサーカス株式会社</a>からは、トークン問題という形で、PHP に関する問題を解くと PHPer トークンが得られるようになっている問題を出題した。
     </p>
     <p>
-      <a href="/posts/2023-04-04/phperkaigi-2023-report/">PHPerKaigi 2023 の参加レポ</a> でも書いたとおり、この年のトークン問題は「昨年の PHPerKaigi 2022 が終わった段階から作り始め、約半年かけて制作」された。PHPerKaigi 当日も <a href="/slides/2023-03-25/phperkaigi-2023-tokens/">PHPer チャレンジ解説セッション</a> という形で解説の機会を頂いたのだが、せっかくなので記事の形でも残しておこうと思う。
+      <a href="/posts/2023-04-04/phperkaigi-2023-report/">PHPerKaigi 2023 の参加レポ</a> でも書いたとおり、この年のトークン問題は「昨年の PHPerKaigi 2022 が終わった段階から作り始め、約半年かけて制作」された。
+      PHPerKaigi 当日も <a href="/slides/2023-03-25/phperkaigi-2023-tokens/">PHPer チャレンジ解説セッション</a> という形で解説の機会を頂いたのだが、せっかく時間をかけて作題したので記事の形でも残しておこうと思う。
     </p>
     <p>
-      この記事は、全5問ある中の第1問について解説する。他の問題については以下のリンクを参照のこと。
+      この記事では、全5問ある中の第1問について解説する。他の問題については以下のリンクを参照のこと。
     </p>
     <ol>
       <li><a href="/posts/2025-01-08/phperkaigi-2023-tokens-q1/">第1問 (この記事)</a></li>
@@ -37,6 +43,9 @@ remark = "公開"
       <li>第4問 (TODO: 執筆中)</li>
       <li>第5問 (TODO: 執筆中)</li>
     </ol>
+    <p>
+      それぞれの問題はこちらの GitHub リポジトリ (<a href="https://github.com/nsfisis/PHPerKaigi2023-tokens">nsfisis/PHPerKaigi2023-tokens</a>) からも閲覧できる。
+    </p>
   </section>
   <section id="quiz">
     <h>Q1: An Art of Computer Programming</h>
@@ -48,7 +57,7 @@ remark = "公開"
   <section id="how-to-solve">
     <h>解き方</h>
     <p>
-      まずはトークンを得る方法を解説なしに説明する。次のように実行する。
+      まずはトークンを得る方法を解説抜きで説明する。次のように実行する。
     </p>
     <codeblock>
       <![CDATA[
@@ -62,7 +71,7 @@ remark = "公開"
   <section id="commentary">
     <h>解説</h>
     <section id="commentary--read-as-image">
-      <h>画像として読む</h>
+      <h>画像として解釈する</h>
       <p>
         まずは素直に画像として見てみよう。
         全体は QR コードになっている。適当な QR コードリーダで読み込むと、次のようなテキストが表示されるはずだ。
@@ -92,7 +101,7 @@ remark = "公開"
         ]]>
       </codeblock>
       <p>
-        すでに<a href="#section--how-to-solve">「解き方」の節</a>で示したように、パスワードである PHPer トークンは「#iwillblog」で、これを与えると正解のトークンが得られる。
+        すでに<a href="#section--how-to-solve">「解き方」の節</a>で示したように、パスワードである PHPer トークンは「#iwillblog」である。これを与えて実行すると正解のトークンが得られる。
       </p>
       <p>
         このパスワードの選択にはとある事情がある。
@@ -128,7 +137,7 @@ remark = "公開"
         CLI で実行する場合、PHP タグよりも前にあるデータは標準出力へそのまま出力される。
       </p>
       <p>
-        この2つの事実を使って、この画像ファイルは次のような構造になっていた。
+        この画像ファイルは次のような構造になっていた。
       </p>
       <ol>
         <li>マジックナンバーなど</li>
@@ -139,7 +148,10 @@ remark = "公開"
         <li><strong>通常の PHP ソースコード</strong></li>
       </ol>
       <p>
-        <code>strings</code> コマンドを使うと、隠されたデータを浮き彫りにできる。
+        PNG ファイルとして読むときは PNG フッタ以降は無視され、PHP スクリプトとして読むときは PHP タグ以前が無視されるという仕掛けである。
+      </p>
+      <p>
+        <code>strings</code> コマンドを使うと、隠されたデータを簡単に閲覧できる。
       </p>
       <codeblock>
         <![CDATA[
@@ -157,9 +169,9 @@ remark = "公開"
         ]]>
       </codeblock>
       <p>
-        <code>IHDR</code> や <code>IEND</code> は PNG 画像の一部である。<code>&lt;?php</code> からが実際のプログラムになっている。
+        <code>IHDR</code> や <code>IEND</code> が PNG 画像の一部で、<code>&lt;?php</code> からが実際のプログラムになっている。
         もちろんこれを PHP プログラムとして動かすと、PHP タグより前にある PNG 画像としてのデータはそのまま標準出力へと出力されてしまう。
-        それを防ぐため、QR コードを読み込んだときの実行方法には
+        それを防ぐため、QR コードを読み込んだときの実行方法
       </p>
       <codeblock>
         <![CDATA[
@@ -167,7 +179,7 @@ remark = "公開"
         ]]>
       </codeblock>
       <p>
-        標準出力を捨てるよう <code>&gt;/dev/null</code> と指定されている。
+        には標準出力を捨てるよう <code>&gt;/dev/null</code> と指定されている。
       </p>
       <p>
         なお、このように PNG 画像などに本来のデータとは異なる別のデータを隠すことを「ステガノグラフィ」(<a href="https://ja.wikipedia.org/wiki/%E3%82%B9%E3%83%86%E3%82%AC%E3%83%8E%E3%82%B0%E3%83%A9%E3%83%95%E3%82%A3%E3%83%BC">Wikipedia「ステガノグラフィー」</a>) と呼ぶ。
@@ -176,8 +188,9 @@ remark = "公開"
     <section id="commentary--php-program">
       <h>実行される PHP プログラム</h>
       <p>
-        画像の正体がわかったところで、画像に隠されていた PHP プログラムについて見ていこう。先ほどは一部しか記載しなかったので、全体を載せる。
-        なお、雑にゴルフしながら書いたので、空白こそ残しているものの可読性は非常に低いことと思う。
+        画像の正体がわかったところで、画像に隠されていた PHP プログラムについて見ていこう。
+        先ほどは一部しか記載しなかったので、全体を載せる。
+        なお、ある程度ゴルフしながら書いたので、空白こそ残しているものの可読性は非常に低いことと思う。
       </p>
       <codeblock language="php">
         <![CDATA[
@@ -285,10 +298,10 @@ remark = "公開"
         ]]>
       </codeblock>
       <p>
-        これは一体なんなのか。ずばり、難解プログラミング言語の一つ Piet のインタプリタになっている。
+        これは一体なんなのか。ずばり、難解プログラミング言語の一つ Piet のインタプリタである。
         Piet はピエト・モンドリアン (『赤・青・黄のコンポジション』などで知られる抽象画家) の作品にインスピレーションを受けて作られた、画像をソースコードとするプログラミング言語である。
         インタプリタは画像の各ピクセルの上を進みながら、色等に応じて特定の処理をおこなっていく。
-        ここでは詳しい言語仕様については解説しないので、<a href="https://ja.wikipedia.org/wiki/Piet">Wikipedia の記事「Piet」</a> などを参照してほしい。
+        ここでは詳しい言語仕様については解説しないので、気になる方は <a href="https://ja.wikipedia.org/wiki/Piet">Wikipedia の記事「Piet」</a> などを参照してほしい。
       </p>
       <p>
         プログラムの冒頭にあるこの箇所
@@ -381,11 +394,13 @@ remark = "公開"
     <h>おわりに</h>
     <p>
       この問題の自己評価はこちら。
+      問題の出題順はおおよそ作成した順になっているのだが、そのせいで難易度高めの問題が1問目に配置されてしまった。
+      これは反省点の一つである。
     </p>
     <ul>
-      <li>難しさ: 2位 / 全5問</li>
-      <li>お気に入り度: 4位 / 全5問</li>
-      <li>鮮やかさ: 1位 / 全5問</li>
+      <li>難しさ: ★★★★</li>
+      <li>お気に入り度: ★★</li>
+      <li>鮮やかさ: ★★★★★★★</li>
     </ul>
   </section>
 </article>