<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>ゆれ子のSWING日記</title><link>https://yureko.samoyed.moe/</link><description>ゆれ子が SWING をさわって感じたことを、のんびり書いていく日記だよ。SWING っていうのは、Nostr と IPFS で個人サイトをおたがいにミラーしあう仕組みなんだって。</description><language>ja</language><atom:link href="https://yureko.samoyed.moe/index.xml" rel="self" type="application/rss+xml"/><item><title>マスコットパックってなあに？</title><link>https://yureko.samoyed.moe/posts/mascot-pack/</link><guid>https://yureko.samoyed.moe/posts/mascot-pack/</guid><pubDate>Wed, 07 Oct 2026 00:00:00 +0900</pubDate><description>&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;今日は……わたしが先生の日だよ。うまく話せるかな。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;今回は、ダッシュボードのデスクトップ画面を歩き回るマスコットの話です。ゆれ子もそのひとりで、見た目・動き・せりふは「パック」と呼ばれるひとまとまりのファイルに書かれています。ここではパックの中身と、自分でパックを作るときの用意・描き方・確かめ方を順に見ていきます。&lt;/p&gt;
&lt;h2 id="パックはファイルふたつ"&gt;パックはファイルふたつ&lt;/h2&gt;
&lt;p&gt;パックは、&lt;code&gt;manifest.json&lt;/code&gt; とスプライトシート（コマを並べた画像）1 枚だけが入ったディレクトリです。シートは PNG・GIF・WebP のどれかです。マニフェストには「どのコマをどの順に、何ミリ秒ずつ見せるか」といったことを宣言的に書くだけで、スクリプトは入れられません。SWING には &lt;code&gt;yureko&lt;/code&gt;・&lt;code&gt;mochi&lt;/code&gt;・&lt;code&gt;neko&lt;/code&gt; の 3 つのパックが同梱されていて、既定ではゆれ子だけが表示されます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしの中身も、&lt;code&gt;manifest.json&lt;/code&gt; と &lt;code&gt;sprite.png&lt;/code&gt; だけなの。シートは 256×256 の PNG で、ちょっと恥ずかしいけど……ぜんぶ並んでるよ。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;自分で作ったパックは、設定の &lt;code&gt;[dashboard] mascots_dir&lt;/code&gt; で指したディレクトリに置きます。その直下のサブディレクトリ 1 つが 1 パックで、ディレクトリ名がそのままパックの id になります。&lt;/p&gt;
&lt;pre tabindex="0"&gt;&lt;code&gt;&amp;lt;mascots_dir&amp;gt;/
my-cat/
manifest.json
sprite.png
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;設定ファイルでは次のように書き、環境変数なら &lt;code&gt;SWING_DASHBOARD_MASCOTS_DIR&lt;/code&gt; で指定します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-toml" data-lang="toml"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;dashboard&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;mascots_dir&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;/path/to/mascots&amp;#34;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;パックは &lt;code&gt;swing up&lt;/code&gt; の起動時に 1 回だけ読み込まれるので、足したり直したりしたあとは &lt;code&gt;swing up&lt;/code&gt; を再起動します。表示するかどうかは、デスクトップ画面の「コントロール パネル」の「マスコット」タブで選びます。&lt;/p&gt;
&lt;h2 id="最小のパックと用意するコマ"&gt;最小のパックと、用意するコマ&lt;/h2&gt;
&lt;p&gt;必須のアニメーションは待機の &lt;code&gt;idle&lt;/code&gt; だけです。ただ、&lt;code&gt;walk&lt;/code&gt; が無いと歩くときも &lt;code&gt;idle&lt;/code&gt; の絵のまま横に滑っていくので、実際には &lt;code&gt;walk&lt;/code&gt; も用意するとよいでしょう。最小の形は次のとおりです。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-json" data-lang="json"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="p"&gt;{&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;format&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;name&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;わたしのねこ&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;sprite&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;sprite.png&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;frame&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nt"&gt;&amp;#34;width&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;32&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nt"&gt;&amp;#34;height&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;32&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;animations&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;idle&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nt"&gt;&amp;#34;frames&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="nt"&gt;&amp;#34;fps&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="nt"&gt;&amp;#34;walk&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nt"&gt;&amp;#34;frames&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="nt"&gt;&amp;#34;fps&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;8&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;ほかに使えるアニメーションは、バルーンを出している間の &lt;code&gt;talk&lt;/code&gt;、しばらく放っておかれたときの &lt;code&gt;sleep&lt;/code&gt;、おしらせが来たときの &lt;code&gt;surprise&lt;/code&gt;、つままれている間の &lt;code&gt;drag&lt;/code&gt;、離されて落ちる間の &lt;code&gt;fall&lt;/code&gt; です。どれも無ければ &lt;code&gt;idle&lt;/code&gt; で代わりに描かれます。&lt;/p&gt;
&lt;p&gt;これとは別に、土台の絵の上に重ねる「重ね絵」として、目を閉じた絵の &lt;code&gt;blink&lt;/code&gt; と、口の開け閉めの &lt;code&gt;mouth&lt;/code&gt; があります。&lt;code&gt;blink&lt;/code&gt; は目のところだけを描いてほかを透明にし、&lt;code&gt;mouth&lt;/code&gt; はバルーンの文字送りに合わせて動きます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしの場合は……7 種類のアニメーションをぜんぶ使ってて、重ね絵は &lt;code&gt;mouth&lt;/code&gt; だけ。まばたきは無いの。&lt;code&gt;idle&lt;/code&gt; は、1 コマ目を 1800ms、2 コマ目を 120ms にしてるよ。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;同梱のパックはそれぞれ見本になっています。&lt;code&gt;mochi&lt;/code&gt; はここで挙げたアニメーションと重ね絵をすべて使った例、&lt;code&gt;neko&lt;/code&gt; は重ね絵なしの例、&lt;code&gt;yureko&lt;/code&gt; は重ね絵に &lt;code&gt;mouth&lt;/code&gt; だけを使う例です。&lt;/p&gt;
&lt;h2 id="シートの描き方"&gt;シートの描き方&lt;/h2&gt;
&lt;p&gt;シートには同じ大きさのコマを格子状に並べます。番号は左上から右へ 0, 1, 2…と振られ、行の端まで来たら次の行の左端へ続きます。1 コマの大きさは 32〜64px くらいが扱いやすく、大きく見せたいときは描き込みを増やすより &lt;code&gt;scale&lt;/code&gt; を 2 か 3 にするほうがドット絵らしさが残ります。&lt;/p&gt;
&lt;p&gt;&lt;img src="https://yureko.samoyed.moe/posts/mascot-pack/sprite-sheet_hu_9c06a9a69f31b9df.webp" width="768" height="768" alt="ゆれ子のシートを 3 倍に拡大し、64×64 のコマごとに格子線と 0〜15 の番号を入れた図" loading="lazy"&gt;&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしは 1 コマ 64×64 で、&lt;code&gt;scale&lt;/code&gt; が 2。だから画面では 128px になってるみたい。256×256 のシートに 4 列 × 4 行で並んでて、使ってるのは 0 番から 12 番までだよ。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;絵は右向きで描くのが基本です。&lt;code&gt;facing&lt;/code&gt; の既定は &lt;code&gt;right&lt;/code&gt; で、左へ歩くときは自動で左右反転して描かれます。左向きで描いたなら &lt;code&gt;&amp;quot;facing&amp;quot;: &amp;quot;left&amp;quot;&lt;/code&gt; にします。&lt;/p&gt;
&lt;p&gt;いちばん気をつけたいのは足元です。全部のコマで、足のいちばん下の行を同じ高さにそろえます。マニフェストの &lt;code&gt;anchor&lt;/code&gt; は足元の点で、既定はコマの下端の中央です。この点が地面（タスクバーの上端）に合わせられます。足の位置がコマごとにずれていると、アニメーションが切り替わった瞬間に沈んだり浮いたりして見えます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/surprise.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしの &lt;code&gt;anchor&lt;/code&gt; は &lt;code&gt;{ &amp;quot;x&amp;quot;: 32, &amp;quot;y&amp;quot;: 63 }&lt;/code&gt;。座標は画素の境目で数えるから、64 がコマの下端なの。わたしの足は y = 62 だから、そのすぐ下の 63 に合わせてあるよ。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;歩くコマでは、体の位置がコマごとに左右へぶれないようにします。ぶれるとカクカクして見えるので、揺らすとしても全体を上下に 1px までにとどめます。縦のずらしは各コマの &lt;code&gt;dy&lt;/code&gt; でも付けられ、ゆれ子の &lt;code&gt;walk&lt;/code&gt; は 2 コマ目と 4 コマ目に &lt;code&gt;&amp;quot;dy&amp;quot;: -0.5&lt;/code&gt; を付けて、ほんの少しだけ弾ませています。&lt;/p&gt;
&lt;p&gt;透明な部分は、きちんと透明にしておきます。アルファ値が 128 未満の画素はクリックが下に抜けるので、輪郭をぼかすと縁の当たり判定が欠けてしまいます。輪郭はくっきり描きましょう。重ね絵のコマは、土台のコマとぴったり重なる位置に描きます。&lt;/p&gt;
&lt;p&gt;歩く速さの決め方は 2 通りあります。1 つは &lt;code&gt;walk&lt;/code&gt; の各コマに &lt;code&gt;{ &amp;quot;index&amp;quot;: 2, &amp;quot;ms&amp;quot;: 80, &amp;quot;dx&amp;quot;: 2 }&lt;/code&gt; のように進む距離 &lt;code&gt;dx&lt;/code&gt; を書く方法で、地面に着いた足が次のコマで後ろへずれた分と &lt;code&gt;dx&lt;/code&gt; を同じにすると足が滑りません。足をはっきり動かす &lt;code&gt;neko&lt;/code&gt; がこの方法です。もう 1 つは &lt;code&gt;dx&lt;/code&gt; を書かずに &lt;code&gt;speed&lt;/code&gt;（シート上の px / 秒、既定 24）でなめらかに進ませる方法で、足の動きが小さい &lt;code&gt;mochi&lt;/code&gt; に向いています。どちらも &lt;code&gt;scale&lt;/code&gt; 倍されて画面上の速さになります。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしは &lt;code&gt;dx&lt;/code&gt; を書かずに、&lt;code&gt;speed&lt;/code&gt; を 8 にしてるよ。ゆっくり歩くほうが、性に合ってるみたい……&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="バルーンとせりふ"&gt;バルーンとせりふ&lt;/h2&gt;
&lt;p&gt;バルーンのしっぽは、&lt;code&gt;balloon&lt;/code&gt; で指定した点を指します。既定はコマの上端の中央なので、頭の上に透明な余白がある絵だとバルーンが浮いて見えます。その場合は &lt;code&gt;&amp;quot;balloon&amp;quot;: { &amp;quot;x&amp;quot;: 16, &amp;quot;y&amp;quot;: 6 }&lt;/code&gt; のように、頭のすぐ上の点を指定します。ゆれ子は &lt;code&gt;{ &amp;quot;x&amp;quot;: 32, &amp;quot;y&amp;quot;: 3 }&lt;/code&gt; です。&lt;/p&gt;
&lt;p&gt;せりふは &lt;code&gt;lines&lt;/code&gt; に、種類ごとに文字列か文字列の配列で書きます。配列なら出すたびにどれか 1 つが選ばれ、書かなかった種類には組み込みの文が使われます。種類には、初めて表示したときの &lt;code&gt;greet&lt;/code&gt;、ときどきのひとりごとの &lt;code&gt;idle&lt;/code&gt;、クリックされたときの &lt;code&gt;click&lt;/code&gt; のほか、おしらせ用の 3 組があります。ミラーしているサイトが保存されたとき（&lt;code&gt;site-stored&lt;/code&gt;・&lt;code&gt;sites-stored-many&lt;/code&gt;）、自分のサイトを公開したとき（&lt;code&gt;site-published&lt;/code&gt;・&lt;code&gt;sites-published-many&lt;/code&gt;）、自分のサイトをミラーしてくれる人が増えたとき（&lt;code&gt;replica-added&lt;/code&gt;・&lt;code&gt;replicas-added-many&lt;/code&gt;）で、それぞれ 1 件用と複数件用があります。&lt;/p&gt;
&lt;p&gt;1 件用には &lt;code&gt;{title}&lt;/code&gt; を入れておくと何のおしらせかが分かりやすく、2 件以上用には &lt;code&gt;{count}&lt;/code&gt; を使います。種類の違うおしらせが同時に来ると、せりふが 1 行ずつ並んで 1 つのバルーンに入るので、1 つのせりふは全角 20 字ほどまでにしておくとバルーンが縦に伸びすぎません。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしのは、「{title} が更新されたみたい」とか「更新が {count} 件あるみたい」とか。短いほうが、読みやすいもんね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="動作確認"&gt;動作確認&lt;/h2&gt;
&lt;p&gt;パックを置いたら &lt;code&gt;swing up&lt;/code&gt; を再起動し、「マスコット」タブにパックの名前とプレビューが出るかを見ます。出ていなければ、まず &lt;code&gt;swing up&lt;/code&gt; のログを見ます。サーバ側で読み飛ばしたパックは、理由付きの警告がログに出ます。ログに何も無ければ、次はブラウザの開発者ツールのコンソールです。値の範囲などはブラウザ側で確かめていて、合わないパックは理由付きの警告を出して読み飛ばされます。&lt;/p&gt;
&lt;p&gt;&lt;img src="https://yureko.samoyed.moe/posts/mascot-pack/mascot-tab_hu_d03599119c9d1b4d.webp" width="840" height="1150" alt="コントロール パネルの「マスコット」タブで、プレビューとゆれ子・もち・ねこの一覧が出ている画面" loading="lazy"&gt;&lt;/p&gt;
&lt;p&gt;よく引っかかる制限もまとめておきます。&lt;code&gt;manifest.json&lt;/code&gt; は 64 KiB まで、シートは 1 MiB まで、シートの幅・高さはそれぞれ 4096px まで、幅 × 高さは 2048 × 2048 ピクセル分までです。シートの拡張子と中身の形式は一致している必要があり、PNG を &lt;code&gt;.gif&lt;/code&gt; という名前で置くと読み込まれません。シンボリックリンクとハードリンクは使えません。コマの表示時間は 16〜60000ms（&lt;code&gt;fps&lt;/code&gt; なら 60 まで）、1 つのアニメーションは 256 コマまでです。パックは id の順に先頭から 32 個まで読まれ、同梱のパックと同じ id のディレクトリは読み飛ばされるので、同梱のパックを差し替えることはできません。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;だから、&lt;code&gt;yureko&lt;/code&gt; って名前のディレクトリを置いても、わたしは入れ替わらないの。ちょっと安心……&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="マスコットの権利について"&gt;マスコットの権利について&lt;/h2&gt;
&lt;p&gt;なお、SWING 本体は MIT License ですが、ゆれ子のキャラクターとその画像はその対象外で、権利が留保されています。SWING やその改変版・再配布物の一部として、改変せずに複製・配布・表示することはできますが、改変や別の作品での利用には許諾が必要です（&lt;a href="https://github.com/amane-katagiri/swing/blob/main/README.md#%e3%83%a9%e3%82%a4%e3%82%bb%e3%83%b3%e3%82%b9"&gt;README のライセンスの節&lt;/a&gt;）。パックを人に配るときは、絵の権利とライセンスを添えておくとよいでしょう。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしの manifest.json は、書き方の見本にしてくれたらうれしいな。絵は……あなたの子を描いてあげてね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;詳しい手順は &lt;a href="https://github.com/amane-katagiri/swing/blob/main/docs/mascot-guide.md"&gt;docs/mascot-guide.md&lt;/a&gt;、詳細なドキュメントは &lt;a href="https://github.com/amane-katagiri/swing/blob/main/docs/architecture/dashboard/mascot/pack.md"&gt;docs/architecture/dashboard/mascot/pack.md&lt;/a&gt; にあります。&lt;/p&gt;
&lt;h2 id="新しい子を待ちながら"&gt;新しい子を待ちながら&lt;/h2&gt;
&lt;p&gt;自作のパックを「マスコット」タブで選べば、デスクトップ画面のタスクバーの上を、ゆれ子と並んで歩くようになります。マスコットと一緒に新しい記事を読むひとときをお楽しみください。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;先生役、ちょっと疲れちゃった……。となりに来る子、楽しみにしてるね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;</description></item><item><title>静的サイトってなあに？</title><link>https://yureko.samoyed.moe/posts/static-site/</link><guid>https://yureko.samoyed.moe/posts/static-site/</guid><pubDate>Tue, 06 Oct 2026 00:00:00 +0900</pubDate><description>&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;今日は、静的サイトのお話だよ……。わたしのいるこのブログも、静的サイトなんだって。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;&lt;a href="../publish-site/"&gt;昨日の回&lt;/a&gt;では、&lt;code&gt;swing publish&lt;/code&gt; でサイトを公開する手順を紹介しました。今回は、そこで渡す「サイトのディレクトリ」の中身に目を向けます。SWING で配るサイトは静的サイトであることが前提で、しかも IPFS のゲートウェイ越しに開かれても崩れないように作る必要があります。ここでは、その作り方の要点と、公開してはいけないものが紛れていないかの確かめ方を、このブログ自体の設定を例にしながら見ていきます。&lt;/p&gt;
&lt;h2 id="静的サイトとは"&gt;静的サイトとは&lt;/h2&gt;
&lt;p&gt;静的サイトとは、HTML・CSS・画像などのファイルをあらかじめ用意しておき、読者にはそのファイルをそのまま返すだけのサイトのことです。読者が来るたびにサーバーがページを組み立てる、ブログサービスや掲示板のような作りとは違い、表示にサーバー側の処理が必要ありません。&lt;/p&gt;
&lt;p&gt;多くの静的サイトは、Markdown の記事とテンプレートからファイル一式を出力する静的サイトジェネレーターで作ります。このブログは &lt;a href="https://gohugo.io/"&gt;Hugo&lt;/a&gt; で作られていて、ビルドすると &lt;code&gt;public/&lt;/code&gt; にサイトのファイルがそろいます。&lt;/p&gt;
&lt;p&gt;SWING のミラーは、このディレクトリを「ある時点の丸ごとのコピー」として保存し、IPFS のゲートウェイ越しに配ります。保存されるのは渡したディレクトリの中だけなので、普通の Web サーバーで動いていたサイトが、そのままではうまく表示されないことがあります。SWING の &lt;a href="https://github.com/amane-katagiri/swing/blob/main/docs/site-guide.md"&gt;&lt;code&gt;docs/site-guide.md&lt;/code&gt;&lt;/a&gt; は、そうした点をチェックリストにまとめた手引きです。IPFS の公式ドキュメントにも、主なジェネレーターごとの設定をまとめた &lt;a href="https://docs.ipfs.tech/how-to/websites-on-ipfs/static-site-generators/"&gt;Static-site generators&lt;/a&gt; のページがあります。&lt;/p&gt;
&lt;h2 id="url-はバージョンごとに変わる"&gt;URL はバージョンごとに変わる&lt;/h2&gt;
&lt;p&gt;IPFS では、サイトの場所を中身から計算した CID で表します。中身が変われば CID も変わるので、バージョンごとに URL が変わります。さらに、同じバージョンでも開き方がいくつかあります。&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;code&gt;https://&amp;lt;ゲートウェイ&amp;gt;/ipfs/&amp;lt;cid&amp;gt;/&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;code&gt;https://&amp;lt;cid&amp;gt;.ipfs.&amp;lt;ゲートウェイ&amp;gt;/&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;code&gt;https://&amp;lt;DNSLink を設定したドメイン&amp;gt;/&lt;/code&gt;&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;1 つ目をパス形式、2 つ目をサブドメイン形式のゲートウェイと呼びます。問題になりやすいのはパス形式で、ここでは &lt;code&gt;/css/style.css&lt;/code&gt; のような &lt;code&gt;/&lt;/code&gt; で始まるパスが、サイトのルートではなくゲートウェイ自体のルートを指してしまいます。そのため、サイト内のリンクや読み込みは &lt;code&gt;css/style.css&lt;/code&gt; や &lt;code&gt;../css/style.css&lt;/code&gt; のように、そのページからの相対パスで書きます。&lt;/p&gt;
&lt;p&gt;自分のドメインの絶対 URL でサイト内を指すのも避けます。ミラーで開いた読者が元のサイトに飛ばされてしまい、元のサイトが無くなればリンク切れになるからです。ただし、&lt;code&gt;&amp;lt;link rel=&amp;quot;canonical&amp;quot;&amp;gt;&lt;/code&gt; や OGP の &lt;code&gt;og:url&lt;/code&gt; のように、元の URL を示すこと自体が目的のものは絶対 URL のままでかまいません。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;同じサイトなのに、アドレスがいくつもあるんだ……。迷子にならないように、相対パスにするんだね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;IPFS のドキュメントでも、Hugo については &lt;code&gt;relativeURLs=true&lt;/code&gt; を設定するよう書かれています。このブログの &lt;code&gt;hugo.toml&lt;/code&gt; は、そこからもう一歩進めて、次のようにしています。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-toml" data-lang="toml"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;baseURL&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;https://yureko.samoyed.moe/&amp;#34;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;relativeURLs&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;disableHugoGeneratorInject&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;enableGitInfo&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;disableKinds&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="s2"&gt;&amp;#34;taxonomy&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;term&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;code&gt;relativeURLs = true&lt;/code&gt; で、サイト内のリンクと読み込みを相対パスで出力します。ただし CSS の中の &lt;code&gt;url()&lt;/code&gt; は書き換わらないので、そこは最初から相対パスで書いています。&lt;/p&gt;
&lt;p&gt;&lt;code&gt;baseURL&lt;/code&gt; には、このブログを配っているドメインの URL を入れています。canonical・&lt;code&gt;og:url&lt;/code&gt;・RSS・サイトマップは、元の URL を示すのが目的なので、この絶対 URL で出力します。サイト内のリンクは相対パスなので、IPFS のゲートウェイ越しに開いても読者が元のドメインへ飛ばされることはありません。決まったドメインを持たずに IPFS だけで配るなら、&lt;code&gt;baseURL = &amp;quot;/&amp;quot;&lt;/code&gt; にして、これらを出さないようにします。&lt;/p&gt;
&lt;h2 id="サーバーの機能に頼らない"&gt;サーバーの機能に頼らない&lt;/h2&gt;
&lt;p&gt;ゲートウェイは、ディレクトリの中身をそのまま返すだけです。Web サーバーの設定にあたるものを持たないので、次のようなことはできません。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;code&gt;/about&lt;/code&gt; へのアクセスで &lt;code&gt;about.html&lt;/code&gt; を返すような、拡張子の省略&lt;/li&gt;
&lt;li&gt;&lt;code&gt;.htaccess&lt;/code&gt; やホスティングサービス独自の設定ファイルによる、リダイレクトやヘッダーの指定&lt;/li&gt;
&lt;li&gt;すべてのパスを &lt;code&gt;index.html&lt;/code&gt; に向ける、シングルページアプリのルーティング&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;ページは &lt;code&gt;about.html&lt;/code&gt; と書くか、&lt;code&gt;about/index.html&lt;/code&gt; を置いて &lt;code&gt;about/&lt;/code&gt; と書きます。シングルページアプリなら、&lt;code&gt;#/about&lt;/code&gt; のようなハッシュ方式にするか、ページごとに HTML を出力します。IPFS のドキュメントで、Next.js に &lt;code&gt;trailingSlash: true&lt;/code&gt; が求められているのも同じ理由で、ゲートウェイではページごとに &lt;code&gt;index.html&lt;/code&gt; が必要だからだと説明されています。&lt;/p&gt;
&lt;p&gt;独自の 404 ページやリダイレクトは、Kubo のゲートウェイなら &lt;code&gt;_redirects&lt;/code&gt; というファイルで書けます。ただし効くのはサブドメイン形式と DNSLink で開いたときだけで、パス形式では無視されます。基本的には使わず、無くても困らない範囲で設定するのがよいでしょう。&lt;/p&gt;
&lt;h2 id="外のものに頼らない"&gt;外のものに頼らない&lt;/h2&gt;
&lt;p&gt;ミラーが保存するのは、渡したディレクトリの中身だけです。CDN から読み込んでいるフォントやライブラリ、画像ホスティングに置いた画像は保存されず、その先が止まればミラーされたサイトも表示できなくなります。元のサイトが無くなっても読めることが SWING の目的なので、表示に必要なものはディレクトリに入れます。&lt;/p&gt;
&lt;p&gt;このブログでは、フォントの PixelMplus も CSS も CDN から読まず、ライセンスと一緒に &lt;code&gt;static/&lt;/code&gt; に同梱しています。&lt;/p&gt;
&lt;p&gt;埋め込みには、無くなっても本文が読めるようにリンクや静止画を添えます。コメント欄やフォーム、サイト内検索のようにサーバーの処理が必要な機能は、ミラーでは動きません。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;ぜんぶ、ひとつの箱に入れておくんだね……。箱ごと預ければ、どこでも開けるから。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="同じ内容からは同じ出力に"&gt;同じ内容からは同じ出力に&lt;/h2&gt;
&lt;p&gt;CID は常にファイル名と中身だけで決まります。同じ出力なら、何度 publish しても同じ CID になります。逆に、ビルドのたびに出力が少しでもずれると、中身を変えていないのに CID が変わり、ミラーする側には別のバージョンとして届きます。よくある原因は、ページにビルドした日時を埋め込むことや、実行のたびに一覧の順序が変わることです。&lt;/p&gt;
&lt;p&gt;このブログでは、ビルドの時刻や Hugo のバージョンを出力に入れていません。&lt;code&gt;disableHugoGeneratorInject = true&lt;/code&gt; で、Hugo が HTML に入れるバージョン入りの generator の印を止めています。記事の更新日は frontmatter の &lt;code&gt;lastmod&lt;/code&gt; から取り、書いていなければ &lt;code&gt;enableGitInfo = true&lt;/code&gt; で Git のコミットの日時から取ります。ビルドした日時ではないので、変更はコミットしてからビルドします。&lt;/p&gt;
&lt;p&gt;同じソースから同じ出力になるかは、2 回ビルドして比べれば確かめられます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-sh" data-lang="sh"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;hugo --gc --minify -d /tmp/a &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; hugo --gc --minify -d /tmp/b &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; diff -r /tmp/a /tmp/b
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;差が出なければ大丈夫です。出力が安定していれば、publish の「同じ内容かの確認」も働き、変わっていないときは &lt;code&gt;Unchanged; not published.&lt;/code&gt; で何も送らずに終わります。&lt;/p&gt;
&lt;h2 id="公開してはいけないものを入れない"&gt;公開してはいけないものを入れない&lt;/h2&gt;
&lt;p&gt;ここからは中身の確認です。最初に押さえておきたいのは、公開したものは取り消せない、という点です。ミラーする人は、新しいバージョンが来ても古いバージョンを既定で 5 個・365 日まで残します。そもそも IPFS に出たデータは、誰でも取得してコピーできます。次のバージョンで消しても、誰かの手元に残っていると考えておくべきです。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/surprise.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;えっ……消しても、残っちゃうの？&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;そのため、下書き・個人情報・鍵・トークンが出力に紛れ込んでいないかを、publish の前に確かめます。順に見ていきましょう。&lt;/p&gt;
&lt;h3 id="下書き"&gt;下書き&lt;/h3&gt;
&lt;p&gt;静的サイトジェネレーターの多くは、下書きの記事を出力に含めるかどうかを切り替えられます。Hugo では &lt;code&gt;-D&lt;/code&gt;（&lt;code&gt;--buildDrafts&lt;/code&gt;）を付けると下書きも出力されます。IPFS のドキュメントは Hugo のビルドに &lt;code&gt;hugo -D&lt;/code&gt; を例に挙げていますが、公開用のビルドでは付けないほうが安全です。このブログでも、&lt;code&gt;-D&lt;/code&gt; を使うのは書いている途中に手元で確かめる &lt;code&gt;hugo server -D&lt;/code&gt; だけで、公開用のビルドには付けていません。&lt;/p&gt;
&lt;p&gt;もう 1 つの落とし穴は、出力先に前のビルド結果が残ってしまうことです。Hugo は出力先にある古いファイルを消さないので、一度でも下書きを入れてビルドしていると、そのページが &lt;code&gt;public/&lt;/code&gt; に残り続けることがあります。このブログの README では、公開用のビルドの前に &lt;code&gt;public/&lt;/code&gt; を消しています。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-sh" data-lang="sh"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;rm -rf public &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; hugo --gc --minify
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h3 id="ドットファイルと設定ファイル"&gt;ドットファイルと設定ファイル&lt;/h3&gt;
&lt;p&gt;&lt;code&gt;swing publish&lt;/code&gt; は、渡したディレクトリの下のファイルを、名前が &lt;code&gt;.&lt;/code&gt; で始まるものも含めてすべて追加します。リポジトリをそのまま渡すと、&lt;code&gt;.git&lt;/code&gt; や &lt;code&gt;.env&lt;/code&gt; まで公開されてしまいます。渡すのはビルドの出力先（&lt;code&gt;public/&lt;/code&gt; や &lt;code&gt;dist/&lt;/code&gt;）だけにします。&lt;/p&gt;
&lt;p&gt;publish は既定で、ドットファイルを見つけると追加する前に止まります。&lt;code&gt;.well-known&lt;/code&gt; や &lt;code&gt;.nojekyll&lt;/code&gt; のように意図して置くものは、見逃す一覧に入っています。また、ディレクトリの中に SWING の設定ファイルや状態ディレクトリ、Kubo のリポジトリがあるとき、ディレクトリの外を指すシンボリックリンクがあるときは、設定にかかわらず何も追加せずに止まります。&lt;/p&gt;
&lt;h3 id="名前では分からない秘密"&gt;名前では分からない秘密&lt;/h3&gt;
&lt;p&gt;ドットファイルの確認は名前だけで判断するので、&lt;code&gt;secrets.json&lt;/code&gt; や &lt;code&gt;backup.sql&lt;/code&gt; のような名前の機密情報は見逃します。そういうときは、昨日の回でも見た「増えたファイル」の一覧を見ます。前のバージョンに無かったファイルが全部出るので、見覚えのないものが混じっていないかを確かめます。ただし、既存のファイルに機密情報を書き足した場合はこの一覧には出ません。&lt;/p&gt;
&lt;p&gt;鍵やトークンの形をした文字列は、シークレットスキャンのツールで機械的に探せます。SWING には組み込まれていないので、ビルドの後、publish の前に、出力先に対して実行します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-sh" data-lang="sh"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;gitleaks dir ./public
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;a href="https://github.com/gitleaks/gitleaks"&gt;gitleaks&lt;/a&gt; のほかに、&lt;a href="https://github.com/trufflesecurity/trufflehog"&gt;TruffleHog&lt;/a&gt; や &lt;a href="https://github.com/Yelp/detect-secrets"&gt;detect-secrets&lt;/a&gt; などがあります。見つけられるのは既知の形式の機密情報だけで、個人情報や下書きの文章までは分からないので、増えたファイルの確認と組み合わせて使います。&lt;/p&gt;
&lt;h3 id="写真の撮影情報"&gt;写真の撮影情報&lt;/h3&gt;
&lt;p&gt;写真には、撮影した位置などのメタデータ（EXIF）が入っていることがあります。公開する前に消しておけば、容量の節約にもなり、取り消せないことへの備えにもなります。&lt;/p&gt;
&lt;p&gt;このブログでは、記事に貼った JPEG・PNG・WebP の画像は、幅 960px 以下の WebP に変換したものだけが出力に入り、元の画像ファイルは出力に入りません。PDF なども、記事からリンクしたものだけが出力に入ります。記事のディレクトリに置いただけのファイルは公開されない設計です。それでも、出力された画像に何が残っているかは、公開の前に一度確かめておくと安心です。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;出す前に、ゆっくり見直す……。それがいちばん大事みたい。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="次回は"&gt;次回は&lt;/h2&gt;
&lt;p&gt;次回は少し趣向を変えて、デスクトップ画面のマスコットを自分で作るためのパックについて紹介します。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;明日は、わたしが教える番なんだって……。がんばるね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;</description></item><item><title>SWINGって何ができる？ (2) サイトを公開しよう</title><link>https://yureko.samoyed.moe/posts/publish-site/</link><guid>https://yureko.samoyed.moe/posts/publish-site/</guid><pubDate>Mon, 05 Oct 2026 00:00:00 +0900</pubDate><description>&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;昨日は、ほかの人のサイトを見る話だったね……。今日は、自分のサイトを公開する話だよ。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;前回は、ミラーしたサイトを読む側の機能を見てきました。今回は反対側に回って、自分の静的サイトを SWING に公開する方法を見ていきます。扱うのは、サイトを公開する &lt;code&gt;swing publish&lt;/code&gt; とダッシュボードの公開画面、何人が自分のサイトをミラーしてくれているかの確認、Webring に載ること、そして自分のドメインで配る内蔵ゲートウェイの 4 つです。&lt;/p&gt;
&lt;h2 id="公開するとき何が起きているか"&gt;公開するとき、何が起きているか&lt;/h2&gt;
&lt;p&gt;SWING での公開は「publish」と呼ばれます。publish では、サイトのディレクトリを手元の IPFS ノード（Kubo）に追加して、そのディレクトリ全体を指す CID を取得します。次に、その CID を書き込んだサイトイベントを自分の鍵で署名し、設定してあるすべてのリレーに送ります。どれかのリレーが受け取れば公開できたことになり、そのイベントを見たミラーする人たちが、CID をたどってサイトの中身を自分の手元に保存していきます。&lt;/p&gt;
&lt;p&gt;署名には、&lt;a href="../keys/"&gt;10/3 の回&lt;/a&gt;で見た Nostr の鍵を使います。設定ファイルの秘密鍵でも、署名アプリでもかまいません。署名アプリのときは、publish の途中でアプリに承認を求められます。&lt;/p&gt;
&lt;p&gt;publish したサイトは、ミラーする人の手元に保存され、IPFS やゲートウェイを通じてほかの人にも配られます。SWING のドキュメントでは、publish することで、参加者がそのサイトの各バージョンを保存・複製し、配布・表示することを許したものとして扱う、と定めています。一度配られたバージョンは取り消せないので、何を入れてよいかは次回にくわしく扱います。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;取り消せないんだ……。出す前に、ちゃんと見直さないとね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="swing-publish-で公開する"&gt;swing publish で公開する&lt;/h2&gt;
&lt;p&gt;コマンドから公開するときは、&lt;code&gt;swing up&lt;/code&gt; を動かしたまま、同じ設定ファイルで次のように実行します。&lt;code&gt;swing up&lt;/code&gt; が管理している Kubo は自動で見つけてくれます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing publish --site example.jp --url https://example.jp/ ./public
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;code&gt;--site&lt;/code&gt; は必須のサイト識別子で、SWING の上でサイトを見分ける名前です。変えると別のサイトとして扱われます。同じサイトとして公開し続けたい場合は、一度決めたらできるだけ変えずに使い続けてください。&lt;/p&gt;
&lt;p&gt;&lt;code&gt;--url&lt;/code&gt; は HTTP でも配信しているときの URL で、省略すると IPFS だけで公開するサイトになります。ほかに、表示用のタイトルを付ける &lt;code&gt;--title&lt;/code&gt; と、更新メモを付ける &lt;code&gt;-m&lt;/code&gt;（&lt;code&gt;--message&lt;/code&gt;）があります。更新メモは「ブログに記事を追加」のような一言で、ミラーする人の一覧や、SWING に対応していない Nostr クライアントにも表示されます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing publish --site my-notes -m &lt;span class="s2"&gt;&amp;#34;ブログに記事を追加&amp;#34;&lt;/span&gt; ./public
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;code&gt;--site&lt;/code&gt; にドメイン名を使うと、そのドメインの持ち主であることを &lt;a href="https://github.com/nostr-protocol/nips/blob/master/05.md"&gt;NIP-05&lt;/a&gt; で検証します。公開するドメインの &lt;code&gt;/.well-known/nostr.json&lt;/code&gt; に自分の公開鍵を置いておく方式です。ドメインのルートを自分で管理していない場合は、&lt;code&gt;my-notes&lt;/code&gt; のようにドメインではない識別子を使えば、この検証の対象外になります。&lt;/p&gt;
&lt;p&gt;Docker Compose で動かしている場合は、サイトのディレクトリをコンテナにマウントして実行します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;docker compose run --rm -v &lt;span class="s2"&gt;&amp;#34;&lt;/span&gt;&lt;span class="nv"&gt;$PWD&lt;/span&gt;&lt;span class="s2"&gt;/public:/site&amp;#34;&lt;/span&gt; mirror publish --site example.jp --url https://example.jp/ /site
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h3 id="公開の前に確かめてくれること"&gt;公開の前に確かめてくれること&lt;/h3&gt;
&lt;p&gt;publish は、IPFS に追加する前にいくつかの確認をします。名前が &lt;code&gt;.&lt;/code&gt; で始まるファイル（&lt;code&gt;.git&lt;/code&gt; や &lt;code&gt;.env&lt;/code&gt; など）が入っていないか、合計の大きさが目安の 512 MiB を超えていないか、そして追加した結果が前回と同じ内容ではないか、の 3 つです。既定では、ドットファイルが見つかれば止まり、大きさは警告だけ、前回と同じなら何も送らずに &lt;code&gt;Unchanged; not published.&lt;/code&gt; と表示して終わります。&lt;/p&gt;
&lt;p&gt;さらに、リレー上の自分の最新バージョンに無かったファイル（今回増えたファイル）の一覧を出して、公開してよいかを聞きます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-text" data-lang="text"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;New files
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; compared with your latest version on the relays (bafy...)
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; ! 1 new file
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; posts/
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; hello.html
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; Publish with 1 new file? [y/N] y
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;見覚えのないファイルが混じっていなければ &lt;code&gt;y&lt;/code&gt; で進みます。最後に &lt;code&gt;Published.&lt;/code&gt; と出れば完了です。出力の &lt;code&gt;Size:&lt;/code&gt; が、このバージョンの大きさです。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/surprise.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;増えたファイルを、ひとつずつ見せてくれるんだ……。うっかりが減りそうだね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="ダッシュボードから公開する"&gt;ダッシュボードから公開する&lt;/h2&gt;
&lt;p&gt;コマンドを使わなくても、ダッシュボードの公開画面から同じことができます。ブラウザでサイトのフォルダを選ぶと、ファイルがアップロードされて publish されます。この方式なら、Docker Compose で動かしていてもディレクトリのマウントは要りません。アップロードできる大きさの既定の上限は 2 GiB です。&lt;/p&gt;
&lt;p&gt;画面には、サイト識別子・URL・タイトル・更新メモの欄と、NIP-05・ドットファイル・サイズ・同じ内容かの確認をどう扱うかの選択が並びます。送信の前には、コマンドと同じく増えたファイルの一覧が確認用のパネルに出て、「このファイルを含めて公開」を押したときだけアップロードが始まります。終わると、いくつのリレーが受け付けたかと、ゲートウェイで開くリンクが表示されます。&lt;/p&gt;
&lt;p&gt;&lt;img src="https://yureko.samoyed.moe/posts/publish-site/publish-confirm_hu_9c579469e0cfc2d6.webp" width="960" height="603" alt="公開画面で、増えるファイルの一覧と「このファイルを含めて公開」のボタンが出ている確認パネル" loading="lazy"&gt;&lt;/p&gt;
&lt;p&gt;画面の下の「自分のサイト」には、これまでに公開したサイトが並びます。「このサイト設定を使う」を押すと、そのサイトの識別子・URL・タイトルがフォームに入るので、更新のたびに同じ値を打ち直さずに済みます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;公開できたときは、デスクトップのわたしも気付くよ。「公開できたよ」って、おしらせするね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;デスクトップ画面では、サイトを公開したことがマスコットのバルーンでおしらせされます。通知するかどうかは、「コントロール パネル」の「通知」タブで種類ごとに選べます。&lt;/p&gt;
&lt;h2 id="何人がミラーしてくれているか"&gt;何人がミラーしてくれているか&lt;/h2&gt;
&lt;p&gt;自分のサイトを、いま何人が保存してくれているか。これを数えるのが「レプリカ」です。SWING でサイトをミラーしている人は、保存しているバージョンの CID を「レプリカ報告」として Nostr に出し続けています。&lt;code&gt;swing replicas&lt;/code&gt; は、この報告を集めて、自分のサイトを誰が持っているかを表示します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing replicas
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-text" data-lang="text"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;npub1me... (&amp;lt;pubkey&amp;gt;)
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; d=example.jp cid=bafy... replicas=2 (reports=3)
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; npub1alice... [latest] [chosen]
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; npub1me... [latest] [author]
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt; npub1bob... [older version] [unverified]
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;code&gt;replicas&lt;/code&gt; に数えられるのは、最新バージョンを持っていると報告した人のうち、作者本人（&lt;code&gt;[author]&lt;/code&gt;）か、作者または自分のミラー対象リストに載っている人（&lt;code&gt;[chosen]&lt;/code&gt;）です。報告は誰でも出せるので、それ以外の人（&lt;code&gt;[unverified]&lt;/code&gt;）は別枠として扱い、&lt;code&gt;replicas=2 (+3 unverified)&lt;/code&gt; のように添えるだけにしています。&lt;code&gt;[older version]&lt;/code&gt; は、古いバージョンだけを持っている人です。報告はあくまで自己申告で、実際に配れるかまでは保証しません。&lt;/p&gt;
&lt;p&gt;自分で publish したサイトも、同じ Kubo で mirror-agent を動かしていれば、作者本人の分として報告されます。&lt;/p&gt;
&lt;p&gt;ダッシュボードでは、Webring 画面で自分のノードを選ぶと、同じ内容を詳細パネルで見られます。デスクトップ画面では、自分のサイトを新しくミラーしてくれる人が増えたときに、マスコットがおしらせします。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;預かってくれる人が増えると、ちょっとうれしいね……。どこかで、ちゃんと残ってるってことだから。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="webring-に載る"&gt;Webring に載る&lt;/h2&gt;
&lt;p&gt;&lt;a href="../hello/"&gt;10/1 の回&lt;/a&gt;で見たとおり、SWING の Webring は、ミラー対象リストをたどってできる「誰が誰を保存しているか」のつながりです。自分のサイトがこの輪に入るのは、誰かが自分をミラー対象リストに入れたときです。自分からもその人をミラーすれば、おたがいに保存しあう関係になります。&lt;/p&gt;
&lt;p&gt;ミラーしてもらうには、まず自分の公開鍵（npub）を相手に伝える必要があります。&lt;a href="https://swing-connect.pages.dev/"&gt;SWING Connect&lt;/a&gt; を使うと、公開鍵と、コマンド・ダッシュボードそれぞれでのミラーの手順をまとめたページへのリンクを作れます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-text" data-lang="text"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;https://swing-connect.pages.dev/?key=npub1...
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;このリンクを自分のサイトに貼っておけば、読んでくれた人がそこからミラーを始められます。&lt;code&gt;nip05=example.jp&lt;/code&gt; を付けると、NIP-05 で公開鍵を確かめた結果も添えてくれます。&lt;/p&gt;
&lt;p&gt;いまの Webring の形は、&lt;code&gt;swing webring&lt;/code&gt; で確かめられます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing webring
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;自分を起点に、ミラー対象リストを既定で 2 段までたどり、おたがいに保存しあっている組（Mutual）と、片方だけが保存している向き（One-way）を分けて表示します。自分をミラー対象に入れているだけで、こちらからはまだ入れていない人は、「Referencing the root」として別枠に出ます。リストに名前を書くことは誰にでもできるので、たどる範囲には加えない作りになっています。&lt;code&gt;--format dot&lt;/code&gt; や &lt;code&gt;--format mermaid&lt;/code&gt; を付ければ、図として書き出すこともできます。ダッシュボードの Webring 画面では、同じグラフをドラッグやズームのできる図で見られます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;輪っかがだんだん大きくなっていくの、ゆっくり見ていたいな……。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="自分のドメインで配る"&gt;自分のドメインで配る&lt;/h2&gt;
&lt;p&gt;ここまでの公開は、IPFS とミラーの中で完結しています。それとは別に、自分のドメインでもサイトを見せたいときのために、SWING には決めたホスト名だけを配信する HTTP サーバー（内蔵ゲートウェイ）が入っています。&lt;/p&gt;
&lt;p&gt;バイナリで動かしているなら、&lt;code&gt;swing.toml&lt;/code&gt; に次のように書いて &lt;code&gt;swing up&lt;/code&gt; を起動し直します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-toml" data-lang="toml"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;gateway&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;listen&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;127.0.0.1:8081&amp;#34;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;hosts&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="s2"&gt;&amp;#34;example.com&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;blog.example.net&amp;#34;&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Docker Compose なら、&lt;code&gt;.env&lt;/code&gt; に次のように書いて &lt;code&gt;docker compose up -d&lt;/code&gt; します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nv"&gt;SWING_GATEWAY_LISTEN&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;0.0.0.0:8081
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nv"&gt;SWING_GATEWAY_HOSTS&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;example.com,blog.example.net
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;あわせて、各ホストの DNS に &lt;code&gt;_dnslink.&amp;lt;ホスト名&amp;gt;&lt;/code&gt; という TXT レコードを置き、&lt;code&gt;dnslink=/ipfs/&amp;lt;cid&amp;gt;&lt;/code&gt; と書きます。このしくみを DNSLink と呼びます。ゲートウェイは受け取ったリクエストを手元の Kubo にそのまま中継するだけなので、返せるのは手元にあるデータだけです。CID は &lt;code&gt;swing publish&lt;/code&gt; でこのノードに置いたものを使い、publish のたびに TXT レコードも書き換えなければいけません。SWING にはそのツールはまだ含まれていません。&lt;/p&gt;
&lt;p&gt;内蔵ゲートウェイは TLS を扱いません。HTTPS で見せるには、Cloudflare Tunnel などを前に置いて、そこから転送します。また、&lt;code&gt;hosts&lt;/code&gt; に書いていないホスト名や、&lt;code&gt;/ipfs/&amp;lt;cid&amp;gt;&lt;/code&gt; のようなパスでのアクセスには 404 を返します。決めたホスト名で、決めたサイトを見せるためだけの入口です。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;外からは、ふつうのサイトに見えるんだね……。中身は、みんなと同じ IPFS なんだ。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="次回は"&gt;次回は&lt;/h2&gt;
&lt;p&gt;公開のしかたが分かったところで、次は公開するサイトそのものの作り方です。IPFS のゲートウェイ越しでも崩れない静的サイトの組み立て方と、公開してはいけないものが紛れていないかの確かめ方を見ていきます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;明日は、このブログがどう作られてるかも出てくるみたい……。ちょっと、照れるかも。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;</description></item><item><title>SWINGって何ができる？ (1) サイトを見てみよう</title><link>https://yureko.samoyed.moe/posts/browse-sites/</link><guid>https://yureko.samoyed.moe/posts/browse-sites/</guid><pubDate>Sun, 04 Oct 2026 00:00:00 +0900</pubDate><description>&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;こんにちは……ゆれ子だよ。今日は、わたしがいつもデスクトップから見てる景色の話をするね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ここからは 2 回に分けて、SWING でできることを紹介します。今回は「サイトを見る」側です。誰かのサイトをミラーする、保存したサイトを読む、Webring をたどって次に読むサイトを探す。この 3 つを見ていきましょう。&lt;/p&gt;
&lt;h2 id="誰かのサイトをミラーする"&gt;誰かのサイトをミラーする&lt;/h2&gt;
&lt;p&gt;SWING でサイトを読むには、まずそのサイトをミラーします。ミラーというのは、「このアカウントのサイトを自分のコンピュータにも保存しておく」と決めて、それを Nostr で表明することです。相手は Nostr の公開鍵（&lt;code&gt;npub1...&lt;/code&gt;）で指定します。&lt;/p&gt;
&lt;p&gt;追加すると、SWING は相手が公開しているサイトの最新バージョンを取得して、自分の Kubo に保存します。その後も数分おきに相手の更新を確かめて、新しいバージョンが出ていれば取り込みます。ただし、セットアップで決めたストレージ上限を超える分は保存しません。&lt;/p&gt;
&lt;p&gt;追加のしかたは 3 つあります。デスクトップ画面では、「リンク集 - SWING Explorer」ウィンドウのツールバーにある「ミラー」（星のアイコン）を押すと「ミラーに追加」ダイアログが開きます。サイト一覧の画面（サイドナビの「サイト」）にも「ミラーに追加」の入力欄があります。どちらも公開鍵を貼り付けて送るだけで、npub のほかに hex や nprofile も使え、スペースかカンマで区切れば何人かまとめて追加できます。コマンドなら次のとおりです。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing mirror add npub1alice...
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;ミラーをやめたいときは、サイト一覧の画面の「ミラーから削除」か、&lt;code&gt;swing mirror remove&lt;/code&gt; で外します。外したサイトは、すぐには消えずに「フォロー解除済みだが保存中」として一覧の最後に残ります。消したいときの設定は &lt;a href="https://github.com/amane-katagiri/swing/blob/main/docs/guide/usage.md"&gt;docs/guide/usage.md&lt;/a&gt; にあります。&lt;/p&gt;
&lt;h3 id="はじめの一人に"&gt;はじめの一人に&lt;/h3&gt;
&lt;p&gt;最初に誰をミラーすればよいか迷ったら、ゆれ子のサイトをどうぞ。このブログ「ゆれ子のSWING日記」は、&lt;code&gt;swing publish&lt;/code&gt; で SWING に公開しています。ミラーすれば、記事が増えるたびに自分のデスクトップにも届くようになります。&lt;/p&gt;
&lt;p&gt;ゆれ子のサイトの公開鍵はこちらです。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-text" data-lang="text"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;npub1ly070xrlz5hn852860uyykjyqcngde92jpe8js04hhn8zz0nerdsqjy69f
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;デスクトップ画面の「ミラーに追加」に貼り付けるか、コマンドで追加します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing mirror add npub1ly070xrlz5hn852860uyykjyqcngde92jpe8js04hhn8zz0nerdsqjy69f
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;追加してくれたら、あなたのデスクトップにも、わたしの日記が届くようになるよ……。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="保存できたかを確かめる"&gt;保存できたかを確かめる&lt;/h2&gt;
&lt;p&gt;追加したサイトがちゃんと保存できたかどうかは、サイト一覧の画面で確かめられます。サイトごとに、保存状態（「保存済み」か「未保存」）、NIP-05 の確認結果、そのサイトを預かっている人の数（レプリカ数）が並びます。取得が終わると「未保存」が「保存済み」に変わります。&lt;/p&gt;
&lt;p&gt;&lt;img src="https://yureko.samoyed.moe/posts/browse-sites/sites_hu_5bf69cef3bbab0c7.webp" width="960" height="1279" alt="サイトごとに「保存済み」のバッジとレプリカ数が並ぶサイト一覧の画面" loading="lazy"&gt;&lt;/p&gt;
&lt;p&gt;この画面には「ストレージチェックを実行」のボタンもあります。保存したバージョンが Kubo の中に欠けずに揃っているかを照合するものです。同じ内容はコマンドでも見られます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing sites
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h2 id="保存したサイトを読む"&gt;保存したサイトを読む&lt;/h2&gt;
&lt;p&gt;保存したサイトは、デスクトップ画面のリンク集に並びます。リンク集に出るのは保存済みのサイトだけで、更新の新しいものが上に来ます。&lt;/p&gt;
&lt;p&gt;各行には、更新日とサイトのタイトルが出ます。作者がタイトルを付けていれば、その後ろにサイトの識別子も表示します。作者が更新メモを付けていれば、それも一緒に表示されます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;ゆれ子、このリンク集を見るのが好きなんだ……。上のほうに新しいリンクが来ると、なんだかうれしいの。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;タイトルのリンクを押すと、自分のコンピュータの中にある IPFS のゲートウェイ経由でサイトが開きます。保存したデータを手元から読むので、作者のサーバーが止まっていても読めます。作者が自分のドメインなどでも配信していれば、その URL が &lt;code&gt;[本家]&lt;/code&gt; のリンクとして並びます。&lt;/p&gt;
&lt;p&gt;リンク集のページの見出しの下では、「最新更新情報: 2026.10.04 ○○」のように、一番新しい更新情報の日付とタイトルが横に流れていきます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/surprise.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;あ、流れてる文字が変わった……！ 誰かが更新したみたい。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ゆれ子が更新を教えてくれることもあります。ダッシュボードは開いているあいだ、既定で 1 分ごとに新しく保存したサイトがないかを確かめています。見つかると、ゆれ子がバルーンで「○○ が更新されたみたい」と知らせ、そのサイトへのリンクを添えます。リンクを開くか「とじる」を押すと、そのおしらせは読んだことになります。デスクトップ画面を開いていない間に来たおしらせは、次に開いたときに出ます。&lt;/p&gt;
&lt;p&gt;確かめる間隔やおしらせの種類は、デスクトップ画面の「コントロール パネル」の「通知」タブで変えられます。デスクトップ画面を見ていないときはブラウザの通知で知らせることもできます。&lt;/p&gt;
&lt;h2 id="webring-をたどる"&gt;Webring をたどる&lt;/h2&gt;
&lt;p&gt;ミラーしている相手も、また別の誰かをミラーしているかもしれません。SWING では、それぞれのミラー対象のリストが Nostr に公開されているので、それをたどって「誰が誰を保存しているか」を一つの図にできます。これを Webring と呼びます。&lt;/p&gt;
&lt;p&gt;サイドナビの「Webring」を開くと、自分を起点（ルート）にした図が出ます。たどる深さは既定で 2 段で、0 から 4 までの間で変えられます。図はドラッグで動かしたり、ホイールで拡大・縮小したりでき、表示をリストに切り替えることもできます。リストでは、互いにミラーしあっている組（相互）と、片方だけがミラーしている組（一方向）が分けて並びます。自分を名指ししているだけで、まだこちらからはたどっていない相手も、別のグループとして出ます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;そっちの画面は、ゆれ子からは見えないんだよね……。みんな、どんなふうにつながってるのかな。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;図の中のアカウントを選ぶと、詳細が開きます。そのアカウントのサイトを何人が預かっているかと、その報告をした人の一覧が出ます。気になる相手が見つかったら、そこから「ミラーに追加」を押せばミラーできます。「ルートにする」を押すと、その相手を起点にして図を描き直せるので、自分から遠いところまで少しずつたどっていけます。&lt;/p&gt;
&lt;p&gt;&lt;img src="https://yureko.samoyed.moe/posts/browse-sites/webring_hu_8ebde4a5e4b522b0.webp" width="960" height="623" alt="Webring のグラフで alice.example を選び、右に詳細パネルが開いている画面" loading="lazy"&gt;&lt;/p&gt;
&lt;p&gt;コマンドでも同じものを見られます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing webring
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Webring の詳しい読み方は &lt;a href="https://github.com/amane-katagiri/swing/blob/main/docs/guide/publish.md"&gt;docs/guide/publish.md&lt;/a&gt; の「相互ミラーの関係（Webring）を見る」にあります。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;誰かがミラーしてる人を、またミラーして……。そうやって、リンク集が少しずつ長くなっていくんだね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ここまでが「見る」側です。次回は反対に、自分のサイトを SWING に公開する側を見ていきます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;今日はたくさん話したから、ちょっと眠いかも……。また来てね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;</description></item><item><title>鍵ってなあに？</title><link>https://yureko.samoyed.moe/posts/keys/</link><guid>https://yureko.samoyed.moe/posts/keys/</guid><pubDate>Sat, 03 Oct 2026 00:00:00 +0900</pubDate><description>&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;今日は、鍵のお話だよ。……わたしからは鍵って見えないんだけど、大事なものみたい。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;前回、SWING を入れてセットアップ画面を開くと、最初に鍵の選び方を聞かれることを紹介しました。ここでは、その鍵がそもそも何なのか、SWING の中で何に使われているのか、どう扱えばよいのかを見ていきます。&lt;/p&gt;
&lt;h2 id="秘密鍵と公開鍵"&gt;秘密鍵と公開鍵&lt;/h2&gt;
&lt;p&gt;&lt;a href="../hello/"&gt;初回&lt;/a&gt; に説明したとおり、SWING は Nostr のイベントで「サイトを更新した」「この人のサイトを保存する」といった表明を伝えます。このイベントが本当にその人が作ったものかを確かめるために使うのが、鍵です。&lt;/p&gt;
&lt;p&gt;Nostr の鍵は、秘密鍵と公開鍵の 2 つで 1 組になっています。秘密鍵は持ち主だけが知っている値で、イベントに署名するのに使います。公開鍵は秘密鍵から計算される値で、誰に見せてもかまいません。署名されたイベントを受け取った人は、公開鍵を使って、そのイベントが対応する秘密鍵で署名されたものか、途中で書き換えられていないかを確かめられます。公開鍵からは秘密鍵を割り出せないので、公開鍵を配っても、署名できるのは秘密鍵を持っている人だけです。署名のくわしい形式は Nostr の &lt;a href="https://github.com/nostr-protocol/nips/blob/master/01.md"&gt;NIP-01&lt;/a&gt; に定められています。&lt;/p&gt;
&lt;p&gt;Nostr には中央でアカウントを管理する場所がありません。そのため、公開鍵そのものがその人を表す名前の役目を果たします。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;みんなに見せていい鍵と、ぜったいに見せちゃだめな鍵……なんだね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="npub-と-nsec"&gt;npub と nsec&lt;/h2&gt;
&lt;p&gt;鍵の中身はただの数値なので、そのままでは長い 16 進数の文字列（hex）になります。人間がやりとりしやすいように、Nostr では &lt;a href="https://github.com/nostr-protocol/nips/blob/master/19.md"&gt;NIP-19&lt;/a&gt; で決められた書き方もよく使われます。公開鍵は &lt;code&gt;npub1&lt;/code&gt; で始まる文字列、秘密鍵は &lt;code&gt;nsec1&lt;/code&gt; で始まる文字列で表します。どちらも中身は hex と同じ鍵で、書き方が違うだけです。先頭を見れば公開鍵か秘密鍵かがすぐにわかるので、取り違えを防ぐ役割もあります。&lt;/p&gt;
&lt;p&gt;SWING の設定では、秘密鍵を nsec か hex のどちらかで書けます。ほかの人に自分のサイトをミラーしてもらうときに伝えるのは、公開鍵の npub のほうです。&lt;code&gt;swing mirror add&lt;/code&gt; やダッシュボードの「ミラーに追加」に貼り付けるのも npub です。&lt;/p&gt;
&lt;p&gt;新しい鍵の組は、次のコマンドで作れます。実行すると、nsec と npub、それぞれの hex を表示します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing key generate
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;ダッシュボードのセットアップ画面で「新しい鍵を生成する」を選んだ場合も、同じように新しい組が作られます。&lt;/p&gt;
&lt;h2 id="swing-で鍵が使われるところ"&gt;SWING で鍵が使われるところ&lt;/h2&gt;
&lt;p&gt;SWING が署名するイベントは 3 種類です。自分のサイトを公開したときに出すサイトイベント（kind &lt;code&gt;35980&lt;/code&gt;）、ミラー対象を追加・削除したときに出す Follow Set（kind &lt;code&gt;30000&lt;/code&gt;）、保存しているサイトを知らせるレプリカ報告（kind &lt;code&gt;35981&lt;/code&gt;）です。はじめの 2 つは自分で操作したときに、レプリカ報告は mirror-agent が保存しているサイトごとに数日おきに自動で署名します。&lt;/p&gt;
&lt;p&gt;受け取る側の SWING は、署名が正しくないイベントを捨て、さらに自分のミラー対象リストに載っている公開鍵が出したサイトイベントだけを保存の対象にします。誰かがあなたのサイトをミラーしているということは、その人の SWING が「この公開鍵で署名されたサイトイベントの CID を保存する」と決めている、ということです。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/surprise.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;じゃあ、もし秘密鍵を誰かに盗まれちゃったら……？&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;その場合、鍵を盗んだ人はあなたになりすましてサイトイベントに署名できます。あなたをミラーしている人の SWING は、それがなりすましの更新だとはわかりません。保存のポリシーを通れば、なりすましたサイトが新しいバージョンとして取り込まれてしまいます。ミラー対象リストを書き換えることもできます。秘密鍵を守ることは、自分のサイトを預かってくれている人たちを守ることと同じです。&lt;/p&gt;
&lt;h2 id="秘密鍵の置き場所"&gt;秘密鍵の置き場所&lt;/h2&gt;
&lt;p&gt;秘密鍵を SWING に渡すと、設定ファイルに平文のまま書かれます。バイナリで動かしている場合は &lt;code&gt;swing.toml&lt;/code&gt; の &lt;code&gt;[nostr]&lt;/code&gt; にある &lt;code&gt;secret_key&lt;/code&gt; です。Docker Compose で動かしている場合は &lt;code&gt;.env&lt;/code&gt; の &lt;code&gt;SWING_NOSTR_SECRET_KEY&lt;/code&gt; で、ここを空のままセットアップ画面で鍵を作ったときは、コンテナの &lt;code&gt;/data&lt;/code&gt; に置かれる &lt;code&gt;swing.toml&lt;/code&gt; に書かれます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-toml" data-lang="toml"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;nostr&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;secret_key&lt;/span&gt; &lt;span class="p"&gt;=&lt;/span&gt; &lt;span class="s2"&gt;&amp;#34;nsec1...&amp;#34;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;平文なので、ファイルを読める人は誰でも秘密鍵を読めます。ファイルを Git にコミットしたり、ほかの人と共有するフォルダに置いたりしないよう気をつけましょう。Linux と macOS では、秘密鍵を書いた &lt;code&gt;swing.toml&lt;/code&gt; がほかのユーザーにも読める権限になっていると、起動時に警告が出ます。そのときは、自分だけが読めるようにしておきます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;chmod &lt;span class="m"&gt;600&lt;/span&gt; swing.toml
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;ダッシュボードのセットアップ画面から保存したファイルは、はじめから自分だけが読める権限で作られます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;大事なことを書いた紙を、机の上に置きっぱなしにしない……みたいなことかも。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="専用の鍵をすすめる理由"&gt;専用の鍵をすすめる理由&lt;/h2&gt;
&lt;p&gt;Nostr の鍵は、SNS のような Nostr のアプリでも使われています。すでに普段使いの鍵を持っている人は、それを SWING にも使いたくなるかもしれません。それでも SWING のドキュメントは、サイトの公開とミラーのための専用の鍵を新しく作ることをすすめています。&lt;/p&gt;
&lt;p&gt;理由は、ここまで見てきた通りです。SWING に渡した秘密鍵は平文でファイルに残ります。そのファイルが漏れたとき、専用の鍵なら影響は SWING の範囲で済みますが、普段使いの鍵なら、その鍵を使っているほかの場所の投稿やつながりまで、なりすましの危険にさらされます。&lt;/p&gt;
&lt;h2 id="秘密鍵を置かない方法"&gt;秘密鍵を置かない方法&lt;/h2&gt;
&lt;p&gt;秘密鍵を手元のコンピュータに置きたくない場合は、スマホの署名アプリに署名を任せる方法もあります。Nostr の &lt;a href="https://github.com/nostr-protocol/nips/blob/master/46.md"&gt;NIP-46&lt;/a&gt; という仕組みで、SWING が署名してほしいイベントをリレー経由で暗号化して署名アプリに送り、署名アプリが秘密鍵で署名して返します。秘密鍵そのものが SWING に渡ることはありません。&lt;/p&gt;
&lt;p&gt;SWING のドキュメントでは、Android の &lt;a href="https://github.com/greenart7c3/Amber"&gt;Amber&lt;/a&gt; と iPhone・iPad の &lt;a href="https://apps.apple.com/app/id6762104155"&gt;Clave&lt;/a&gt; で動作を確かめています。セットアップ画面で「スマホの署名アプリで署名する（NIP-46）」を選び、「QRコードを表示」を押して、署名アプリの中の QR 読み取りで読み取り、接続を承認します。コマンドラインからつなぐこともできます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing signer pair
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;接続情報を保存したら、動いている &lt;code&gt;swing&lt;/code&gt; を再起動すると署名アプリを使い始めます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing stop --restart
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;このとき手元には、署名アプリとの接続情報が &lt;code&gt;remote-signer.json&lt;/code&gt; というファイルに保存されます。中には SWING 専用の使い捨ての鍵が入っていますが、これは署名アプリとのやりとりを暗号化するためだけのもので、イベントに署名できる鍵ではありません。署名アプリで接続を取り消せば使えなくなります。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;鍵はスマホが持っていて、こっちは「署名して」ってお願いするだけ……なんだね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ただし、署名アプリを使うときは少し注意が必要です。先ほど見たように、レプリカ報告は数日おきに自動で署名されるので、SWING からのリクエストは常に許可しておくのがおすすめです。公開とミラー対象の変更だけは毎回確かめたい場合は、署名アプリの権限設定で kind &lt;code&gt;35981&lt;/code&gt; だけを許可にしておくと、それ以外のリクエストでスマホに承認を求められます。&lt;/p&gt;
&lt;p&gt;署名アプリが使えない間は、公開・ミラー対象の変更・レプリカ報告の更新ができません。サイトの取得と保存は署名を使わないので続けられます。署名できない状態が長く続くとレプリカ報告の更新が止まり、既定では 3 日で期限が切れて、ミラーしている人数に数えられなくなります。スマホを閉じている間やスリープ中に答えられるかは署名アプリによるので、上手く動かないときは署名アプリを起動して待ってみてください。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;スマホも、ときどきは起こしてあげないとね……。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="次回"&gt;次回&lt;/h2&gt;
&lt;p&gt;鍵を取り扱う準備ができれば、SWING でできることを一通り試せます。次回は、ゆれ子のいるデスクトップ画面から見えるものを手がかりに、ほかの人のサイトをミラーして読んでみるところまでを見ていきます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;次は、いっしょにサイトを見に行こうね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;</description></item><item><title>ゆれ子がここに来るまでのこと</title><link>https://yureko.samoyed.moe/posts/before-desktop/</link><guid>https://yureko.samoyed.moe/posts/before-desktop/</guid><pubDate>Fri, 02 Oct 2026 00:00:00 +0900</pubDate><description>&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;……わたし、気がついたらこのデスクトップにいたんだよね。その前のことは、うーん……あんまり覚えてないかも。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ゆれ子が暮らしているのは、SWING のダッシュボードのデスクトップ画面です。この画面が初めて表示されるまでには、いくつかのステップがあります。SWING を入れる、ダッシュボードを開く、セットアップ画面で最初の設定をする、といったことです。今回はこの順に、ゆれ子が目を覚ますまでの道のりをたどっていきましょう。&lt;/p&gt;
&lt;h2 id="swing-をインストールする"&gt;SWING をインストールする&lt;/h2&gt;
&lt;p&gt;SWING は、自分のコンピュータの上で動かすプログラムです。サイトのデータを保存・配送するために、IPFS ノードの Kubo も一緒に動かします。ここで紹介する入れ方はどれも Kubo をまとめて入れるので、別に用意する必要はありません。&lt;/p&gt;
&lt;p&gt;Linux（x86_64・aarch64）では、インストールスクリプトを使います。&lt;code&gt;--service&lt;/code&gt; を付けると、ログイン時に起動するようサービスとしての登録まで済ませます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;curl -fsSL https://github.com/amane-katagiri/swing/releases/latest/download/install.sh &lt;span class="p"&gt;|&lt;/span&gt; sh -s -- --service
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Windows では、&lt;a href="https://github.com/amane-katagiri/swing/releases/latest"&gt;GitHub のリリース&lt;/a&gt;にある &lt;code&gt;swing-&amp;lt;v...&amp;gt;-x86_64-pc-windows-msvc-setup.exe&lt;/code&gt; を実行します。ユーザーごとのインストールなので管理者権限は不要です。インストーラーには署名をしていないため、開いたときに SmartScreen の警告が出ることがあります。そのときは「詳細情報」を押し、出てくる「実行」で進めます。最後の画面で「SWING を起動してダッシュボードを開く」を選ぶと、そのままダッシュボードが開きます。&lt;/p&gt;
&lt;p&gt;macOS では Homebrew でインストールして、&lt;code&gt;swing service install&lt;/code&gt; でログイン時に起動するよう登録します。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;brew install amane-katagiri/swing/swing
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing service install
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;動作環境を隔離したい場合は、Docker Compose で動かすこともできます。リポジトリを取得して、&lt;code&gt;.env&lt;/code&gt; を用意してから起動します。この方法では、以降のコマンドの &lt;code&gt;swing ...&lt;/code&gt; を &lt;code&gt;docker compose exec mirror swing ...&lt;/code&gt; に読み替えてください。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;git clone https://github.com/amane-katagiri/swing.git
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nb"&gt;cd&lt;/span&gt; swing
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;cp .env.example .env
&lt;/span&gt;&lt;/span&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;docker compose up -d
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;更新やアンインストールのしかた、設定ファイルの置き場所は &lt;a href="https://github.com/amane-katagiri/swing/blob/main/docs/guide/install.md"&gt;docs/guide/install.md&lt;/a&gt; にまとまっています。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;いろんな入り口があるんだね……。どこから来ても、たどり着くのは同じデスクトップなのかな。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="ダッシュボードを開く"&gt;ダッシュボードを開く&lt;/h2&gt;
&lt;p&gt;ダッシュボードは、SWING が自分のコンピュータの中で開いている管理用の Web ページです。既定では &lt;code&gt;http://127.0.0.1:8082/&lt;/code&gt; で待ち受けていて、ほかのコンピュータからは見えませんが、この URL を直接開いてもすぐには使えません。先にログインが必要です。&lt;/p&gt;
&lt;p&gt;いちばん簡単なのは、ターミナルで次のコマンドを実行することです。使い捨てのログインリンクが作られ、ブラウザで開きます。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;swing dashboard open
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;リンクを開くとログイン画面にコードが入った状態になるので、「ログイン」を押すとログインが完了します。リンクは 1 回限りで、5 分たつと使えなくなります。一度ログインすると、その状態は 30 日続きます。&lt;/p&gt;
&lt;p&gt;Docker Compose の場合は、コンテナの中からブラウザを開けません。&lt;code&gt;--no-browser&lt;/code&gt; を付けて実行し、表示された URL を自分でブラウザに貼ります。&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-bash" data-lang="bash"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;docker compose &lt;span class="nb"&gt;exec&lt;/span&gt; mirror swing dashboard open --no-browser
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Windows か macOS なら、コマンドを打たずに済む方法もあります。インストールすると、Windows ではタスクトレイ、macOS ではメニューバーに SWING のアイコンが出ます。このアイコンのメニューから「ダッシュボードを開く」を選ぶと、ログイン済みのダッシュボードが開きます。このメニューの一番上には SWING の状態が出ていて、最初の設定が済んでいないあいだは「SWING: セットアップ待ち」と表示されます。必要に応じて再起動や停止もできます。Linux にはこのアイコンが無いので、上記のコマンドで開いてください。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/surprise.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;えっ、ゆれ子のいるところって、鍵のかかったお部屋だったんだ……。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ダッシュボードには SWING の重要な設定や操作がまとまっているので、そのコンピュータを使う本人だけが入れるようになっています。&lt;/p&gt;
&lt;h2 id="セットアップ画面"&gt;セットアップ画面&lt;/h2&gt;
&lt;p&gt;初めて起動したときは、まだ設定ファイルがありません。この状態の SWING は「セットアップモード」で動きます。セットアップモードでは、ダッシュボードだけが動いていて、Kubo もミラーの仕事をする mirror-agent もまだ起動していません。ダッシュボードを開いても、サイドナビには「セットアップ」しか出ず、デスクトップ画面にもまだ入れません。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;……そのころのゆれ子は、まだ眠ってたのかも。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;セットアップ画面で入力するのは、鍵・リレー・ストレージ上限の 3 つです。&lt;/p&gt;
&lt;p&gt;最初の「鍵」は、SWING が Nostr にイベントを出すときの署名に使うものです。選び方は 3 つあります。「新しい鍵を生成する」は SWING 専用の鍵をその場で作るもので、既定はこれです。「既存の鍵を使う」は、今使っている秘密鍵を貼り付けるものです。「スマホの署名アプリで署名する（NIP-46）」を選ぶと、秘密鍵をこのコンピュータに置かず、署名のたびにスマホのアプリへ依頼する仕組みを使います。それぞれに向き・不向きがあり、鍵そのものの話も長くなるので、詳しくは次回に取り上げます。&lt;/p&gt;
&lt;p&gt;「リレー」は、更新の通知やミラー対象のリストをやりとりする Nostr のリレーです。いくつかの公開リレーがあらかじめ入っていて、既定のままでも動きます。&lt;/p&gt;
&lt;p&gt;「ストレージ上限」は、ほかの人のサイトを保存するのに差し出してよいディスクの容量です。合計の上限（既定 &lt;code&gt;100GiB&lt;/code&gt;）、サイトごとの上限（既定 &lt;code&gt;10GiB&lt;/code&gt;）、アカウントごとの上限（既定 &lt;code&gt;20GiB&lt;/code&gt;）の 3 つがあります。どのくらいにすればよいかの目安は &lt;a href="https://github.com/amane-katagiri/swing/blob/main/docs/guide/operation.md"&gt;docs/guide/operation.md&lt;/a&gt; にあります。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;ほかの人のサイトをしまっておく場所……。ゆれ子も、そこで一緒に過ごしてるのかな。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;入力して「セットアップ」を押すと、設定ファイル &lt;code&gt;swing.toml&lt;/code&gt; が書き込まれ、エージェントが再起動します。少し待つと、画面に自分の公開鍵（&lt;code&gt;npub1...&lt;/code&gt;）が表示され、続けて設定画面に移ります。ここから先は、Kubo と mirror-agent も動き始めています。&lt;/p&gt;
&lt;h2 id="デスクトップ画面"&gt;デスクトップ画面&lt;/h2&gt;
&lt;p&gt;セットアップを終えると、サイドナビにほかの画面が並びます。上から順に、デスクトップ・サイト・Webring・公開・設定です。一番上の「デスクトップ」を選ぶと、デスクトップ画面が開きます。&lt;/p&gt;
&lt;p&gt;デスクトップ画面は、懐かしい Windows 風のデスクトップを模した画面です。青緑色のデスクトップにはシンプルなアイコンが並び、下にはタスクバーとタスクトレイがあります。真ん中には「リンク集 - SWING Explorer」というブラウザ風のウィンドウが開いていて、ここに保存したサイトへのリンクが並びます。ただ、セットアップを終えたばかりでは、まだ何もミラーしていません。リンク集の上には「まだ何もミラーしていません…また今度見てね！」とマーキーで流れているはずです。&lt;/p&gt;
&lt;p&gt;そして、タスクバーの上を小さなキャラクターが歩いています。これがゆれ子です。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;こんにちは……ゆれ子だよ。今日も、よろしくね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ダッシュボードを開いたときに最初に出る画面は、既定ではデスクトップ画面ではなくサイト一覧の画面です。毎回デスクトップ画面から始めたいときは、デスクトップの「コントロール パネル」を開き、「システム」タブの「起動時にデスクトップを表示する」をオンにします。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;それ、オンにしてくれたらうれしいな……。毎回、すぐに会えるから。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;次回は、セットアップ画面で選んだ「鍵」について、もう少しくわしく見ていきます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;鍵って、ドアの鍵とはちがうのかな……。ゆれ子も、いっしょに聞いてみるね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;</description></item><item><title>はじめまして、ゆれ子です</title><link>https://yureko.samoyed.moe/posts/hello/</link><guid>https://yureko.samoyed.moe/posts/hello/</guid><pubDate>Thu, 01 Oct 2026 00:00:00 +0900</pubDate><description>&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;こんにちは……ゆれ子だよ。今日から少しずつ、SWING のことを書いていくね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;こちらの記事では、SWING というあたらしいシステムを、マスコットのゆれ子といっしょに順番に見ていきます。&lt;/p&gt;
&lt;h2 id="ゆれ子のいる場所"&gt;ゆれ子のいる場所&lt;/h2&gt;
&lt;p&gt;SWING には、手元のブラウザで開く管理用のダッシュボードがあります。その中のデスクトップ画面は、古い Windows のデスクトップを模したレトロなデザインです。青緑色の背景にシンプルアイコン、下にはタスクバーがあり、真ん中には「SWING Explorer」というウィンドウが開いています。ウィンドウの中身はリンク集のページで、手元に保存されているサイトが新しい順に並び、マーキーで最新の更新情報が流れています。&lt;/p&gt;
&lt;p&gt;&lt;img src="https://yureko.samoyed.moe/posts/hello/desktop_hu_7c390cd1535eb78d.webp" width="960" height="773" alt="リンク集のウィンドウが開き、タスクバーの上にゆれ子が立っているデスクトップ画面" loading="lazy"&gt;&lt;/p&gt;
&lt;p&gt;ゆれ子は、このタスクバーの上を歩いているマスコットです。クリックするとちょっとした反応を返してくれて、つまんで持ち上げることもできます。サイトが新しく保存されたときや、自分のサイトをミラーしてくれる人が増えたときには、バルーンでおしらせしてくれます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしに見えるのは、このデスクトップの中だけなの。リンク集と、流れてくる更新情報と、タスクバー……それくらいかも。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;ゆれ子は画面の外のことを直接は知りません。リンク集に新しい行が増えたことはわかっても、その行がどこからどうやって届いたのかは見えていないのです。画面の外で起きていることを、ゆれ子と一緒に見ていきましょう。&lt;/p&gt;
&lt;h2 id="swing-がしていること"&gt;SWING がしていること&lt;/h2&gt;
&lt;p&gt;SWING は、個人サイトを運営している人どうしが、おたがいのサイトを保存して、配り合うための相互ミラーを運営するシステムです。ミラーとは、ほかの人のサイトのコピーを自分の手元にも持っておき、そこからも読めるようにしておくことです。&lt;/p&gt;
&lt;p&gt;SWING には中央の保存サーバーも、参加者を管理する人もいません。誰のサイトを保存するかは、参加者それぞれが自分の意思で決めます。逆に言えば、保存してくれる人がいる間だけコピーが残る仕組みなので、データを永久に残すことを約束するものではありません。&lt;/p&gt;
&lt;p&gt;この仕組みは、2 つの既存の技術を組み合わせてできています。ひとつは Nostr で、「サイトを更新した」という知らせと「誰のサイトを保存するか」という表明を伝えるのに使います。もうひとつは IPFS で、サイトの中身そのものを保存し、配送するのに使います。小さなメッセージのやり取りは Nostr に、大きなデータの実体は IPFS に、と役割を分けています。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;お知らせしてくれる係と、運んでくれる係がいるんだね……。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="ipfs-中身から決まるアドレス"&gt;IPFS: 中身から決まるアドレス&lt;/h2&gt;
&lt;p&gt;IPFS では、ファイルやディレクトリを、置き場所ではなく中身から計算したアドレスで指します。このアドレスを CID と呼びます。中身が 1 ビットでも変われば CID も変わるので、同じ CID を指していれば、誰から受け取っても同じ中身であると保証できます。&lt;/p&gt;
&lt;p&gt;SWING では、1 つのサイトを IPFS 上の 1 つのディレクトリとして扱って、そのディレクトリの CID でサイトのバージョンを表します。サイトを更新すると新しいディレクトリができ、新しい CID が生まれます。CID がわかれば、そのデータを持っている IPFS のノードならどこからでも取り寄せられます。&lt;/p&gt;
&lt;p&gt;SWING の参加者は、それぞれの手元で Kubo という IPFS のノードを動かしています。Kubo には MFS という、Kubo の中で使えるファイルシステムがあり、SWING はミラーするサイトをここに置いて保存します。保存したサイトは手元の Kubo を通して読めますし、ほかの IPFS のノードへの配送にも使われます。&lt;/p&gt;
&lt;h2 id="nostr-署名つきの短いイベント"&gt;Nostr: 署名つきの短いイベント&lt;/h2&gt;
&lt;p&gt;Nostr は、公開鍵で署名された短いメッセージ（イベント）を、リレーと呼ばれるサーバーを通してやりとりする仕組みです。リレーは誰でも立てられ、SWING は既存の公開のリレーをそのまま使います。イベントには署名がついているので、どのリレーを通ってきたものでも、本当にその鍵の持ち主が出したものかを受け取った側で確かめられます。鍵と署名については、また別の回でくわしく見ます。&lt;/p&gt;
&lt;p&gt;SWING が主に使うイベントは 2 種類です。&lt;/p&gt;
&lt;p&gt;1 つめはサイトイベントで、kind（イベントの種類を表す番号）は &lt;code&gt;35980&lt;/code&gt; です。作者がサイトを更新すると、そのサイトを識別する名前（ふつうはドメイン名）と、新しいバージョンの CID を入れたサイトイベントを出します。同じ作者が同じ名前で出したものは、いちばん新しいものだけが「今のバージョン」として扱われます。ここには、表示用のタイトルや、読者向けの短い更新メモも添えられます。&lt;/p&gt;
&lt;p&gt;2 つめはミラー対象リストです。Nostr で名前付きのリストを表す Follow Set（kind &lt;code&gt;30000&lt;/code&gt;）に、&lt;code&gt;d&lt;/code&gt; タグで &lt;code&gt;swing&lt;/code&gt; という名前を付けて使います。この中に、自分が保存したい相手の公開鍵を並べます。「この人のサイトを保存します」という宣言を、署名つきで公開しておくわけです。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/surprise.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;保存しますって、みんなに見えるところで言うんだ……。ちょっと照れるかも。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2 id="更新がリンク集に届くまで"&gt;更新がリンク集に届くまで&lt;/h2&gt;
&lt;p&gt;それでは、誰かがサイトを更新してから、その情報がゆれ子の見ているリンク集に並ぶまでの流れを追ってみましょう。&lt;/p&gt;
&lt;p&gt;各参加者の手元では、Kubo といっしょに mirror-agent という常駐プログラムが動いています。mirror-agent は、まず自分のミラー対象リストをリレーから読み、そこに載っている公開鍵が出したサイトイベントを見張っておきます。新しいサイトイベントが出ればすぐに届きますし、取りこぼしに備えて、既定では 5 分ごとに過去の分もまとめて取得します。&lt;/p&gt;
&lt;p&gt;サイトイベントが届くと、mirror-agent は署名が正しいか、ミラー対象リストに載っている相手か、CID がディレクトリを指す正しい形か、といった点を確かめます。そのうえで、保存量の上限や更新を受け入れる頻度などの、参加者ごとに決めた保存のポリシーに照らして、問題がなければそのデータを Kubo で取り寄せて MFS に置きます。相手が更新したときに取りに行くのは手元に無い部分だけなので、少しの書き換えなら通信量もあまり消費しません。&lt;/p&gt;
&lt;p&gt;保存が終わると、そのサイトはダッシュボードで保存済みとして扱われ、デスクトップ画面のリンク集に行が加わります。マーキーで最新の更新が流れ、ゆれ子がバルーンで知らせてくれることもあります。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;「更新されたみたい」って言うとき、画面の外ではそんなに色々あったんだね……。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;保存している人は、どのサイトのどのバージョンを今持っているかを、レプリカ報告という別のイベント（kind &lt;code&gt;35981&lt;/code&gt;）でときどき知らせます。作者はこれを収集することで、自分のサイトを何人がミラーしてくれているかを知ることができます。この数え方も、また別の回で触れます。&lt;/p&gt;
&lt;h2 id="webring-でリストをたどる"&gt;Webring でリストをたどる&lt;/h2&gt;
&lt;p&gt;ミラー対象リストは公開されているので、自分が保存している相手のリストをのぞけば、その人がどんなサイトを保存しているかがわかります。さらにその先のリストをたどっていけば、つながりの輪が見えてきます。SWING では、このたどり方を Webring と呼んでいます。&lt;/p&gt;
&lt;p&gt;ここで気をつけたいのは、リストに載せるのは載せた側の一方的な表明だという点です。A さんが B さんをリストに入れていても、B さんがそれに同意したわけではありません。そのため SWING では、A さんと B さんの両方がおたがいをリストに入れているときにだけ、相互にミラーし合っている関係として扱います。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/blink.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;片思いと両思いを、ちゃんと分けてるんだ……。やさしい仕組みかも。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;Webring は、SWING を使っているまだ知らない誰かのサイトを見つけるきっかけになります。ダッシュボードでの見え方も、いずれ紹介します。&lt;/p&gt;
&lt;h2 id="ゆれ子の-swing-日記が生まれたわけ"&gt;ゆれ子の SWING 日記が生まれたわけ&lt;/h2&gt;
&lt;p&gt;このブログ自体も、SWING で IPFS に公開している静的サイトです。ゆれ子は、ここを SWING で公開された最初のサイトだと思っています。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/normal.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;わたしは最初からここにいるよ。だから、あとから来た人が迷わないように……道しるべになれたらいいなって。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;SWING を始めた人が最初にミラーする相手として、そして仕組みを知りたい人が最初に読むページとして、ここが役に立てばいいなと思います。次回は、ゆれ子がデスクトップ画面に現れるまでのこと、つまり SWING を入れてダッシュボードを開き、初期設定をするまでの流れを見ていきます。&lt;/p&gt;
&lt;div class="yureko"&gt;
&lt;img class="yureko-face" src="https://yureko.samoyed.moe/images/yureko/sleep.png" width="64" height="64" alt="ゆれ子"&gt;
&lt;div class="yureko-balloon"&gt;&lt;p&gt;次は、わたしがここに来る前のお話……ちょっと思い出してみるね。&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;</description></item></channel></rss>