<?xml version="1.0" encoding="UTF-8" standalone="no"?><rss xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" version="2.0"><channel><title>マトリョーシカ的日常</title><description>ワクワクばらまく明日のブログ。</description><managingEditor>noemail@noemail.org (kyokucho1989)</managingEditor><pubDate>Sat, 28 Mar 2026 06:07:24 +0900</pubDate><generator>Hatena::Blog https://blog.hatena.ne.jp/</generator><language>en-us</language><itunes:explicit>no</itunes:explicit><itunes:subtitle>ワクワクばらまく明日のブログ。</itunes:subtitle><itunes:owner><itunes:email>noemail@noemail.org</itunes:email></itunes:owner><item><title>欲しい、欲しい、欲しい——全部の呪文。36歳、芽が出た。ぼくはエンジニア。表明</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sat, 28 Mar 2026 06:07:24 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901369899088</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20260328/20260328060557.jpg" width="1200" height="688" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>完全にナチュラルな文章については、書くことも読むことも減ってしまった。近頃は比較的整形されたフレーズが世に蔓延っていて、そこから血の匂いを感じない。自分自身のそれについてもそう。非AI時代の文章は過去のものとなる。すこしのさみしさや恐れが発生している。</p>

<p>プロジェクト・ヘイル・メアリーを観てきた。太陽を蝕む微生物を、たった一人の地球人がやっつける話だった。主人公が船長でもなく、技術者でもなく、科学者で教師であったから、物語は良い方向に進んだのだと思った。インターステラーほど驚きはないし、オデッセイほどワクワクはしない。それでも鑑賞後は人間の尊厳というか希望で満たされた。良い。</p>

<p>私の人生に対しては、複数のシナリオが同時に進行している節がある。昨年末からさらに加速した。自分がやりたいことをやる。それだけの気持ちだった。</p>

<p>昔やってたウィザードリィというゲームでは、ビショップという職業がある。魔法使い系と僧侶系の呪文両方を取得することができるし、謎のアイテムの鑑定もできてしまう。非常に優れた上位職だが、それらを覚えるまでに必要なレベルが他の職業とは違ってかなり高い。いろいろできるようなるが、成長が遅い。</p>

<p>私も成長が遅い。遅いというか、ハードもソフトも中途半端にいろいろ手を出してしまって、成長を実感できないまま三十代前半を過ごしてしまった。それが昨年プログラミングスクールを卒業したあたりで、ようやく自身のスキルが定着した感覚を抱くようになった。ウェブプログラマーの下地が身についた気がする。本職では、3DCADを用いた機械設計も手に馴染んできて、これはこれで設計の速度が上がった。そして、なぜか第二種電気工事士の資格も取得した。</p>

<p>家庭の事情で学習に時間をかけられないこともあって、理解の歩みは遅かった。それでも続けたらここまで来れた。あとは気持ちというか気概の問題な気がする。</p>

<p>プロジェクト・ヘイル・メアリーに登場する彼の思想をぜひ手本としたい。日本語変換された言葉は語彙力に欠けるが、それでも課題をエンジニアリングによって解決する姿勢は良い。良い、良い、良い。感傷的にならず、何をすれば良いか、自分が何ができるかを知的好奇心をエンジンとして取り組んでいる。</p>

<p>肉体は衰えるばかりだが、知識はまだ入る。というより、知識面の成長は加速している気がする。やれることは全部やるぞ。表明。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E6%9F%94%E3%82%89%E3%81%8B%E3%81%AA%E5%A4%95%E7%84%BC%E3%81%91%E3%81%AE%E5%85%89%E3%81%AB%E7%85%A7%E3%82%89%E3%81%95%E3%82%8C%E3%81%9F%E3%82%AE%E3%82%B6%E3%82%AE%E3%82%B6%E3%81%AE%E5%B1%B1%E3%80%85-NwZmYW5ETnE?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a> <a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>完全にナチュラルな文章については、書くことも読むことも減ってしまった。近頃は比較的整形されたフレーズが世に蔓延っていて、そこから血の匂いを感じない。自分自身のそれについてもそう。非AI時代の文章は過去のものとなる。すこしのさみしさや恐れが発生している。 プロジェクト・ヘイル・メアリーを観てきた。太陽を蝕む微生物を、たった一人の地球人がやっつける話だった。主人公が船長でもなく、技術者でもなく、科学者で教師であったから、物語は良い方向に進んだのだと思った。インターステラーほど驚きはないし、オデッセイほどワクワクはしない。それでも鑑賞後は人間の尊厳というか希望で満たされた。良い。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/a1229d7f9e43917e64ef2dc701d7313aec987f3b/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20260328%2F20260328060557.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>完全にナチュラルな文章については、書くことも読むことも減ってしまった。近頃は比較的整形されたフレーズが世に蔓延っていて、そこから血の匂いを感じない。自分自身のそれについてもそう。非AI時代の文章は過去のものとなる。すこしのさみしさや恐れが発生している。 プロジェクト・ヘイル・メアリーを観てきた。太陽を蝕む微生物を、たった一人の地球人がやっつける話だった。主人公が船長でもなく、技術者でもなく、科学者で教師であったから、物語は良い方向に進んだのだと思った。インターステラーほど驚きはないし、オデッセイほどワクワクはしない。それでも鑑賞後は人間の尊厳というか希望で満たされた。良い。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>完全にナチュラルな文章については、書くことも読むことも減ってしまった。近頃は比較的整形されたフレーズが世に蔓延っていて、そこから血の匂いを感じない。自分自身のそれについてもそう。非AI時代の文章は過去のものとなる。すこしのさみしさや恐れが発生している。 プロジェクト・ヘイル・メアリーを観てきた。太陽を蝕む微生物を、たった一人の地球人がやっつける話だった。主人公が船長でもなく、技術者でもなく、科学者で教師であったから、物語は良い方向に進んだのだと思った。インターステラーほど驚きはないし、オデッセイほどワクワクはしない。それでも鑑賞後は人間の尊厳というか希望で満たされた。良い。</itunes:summary></item><item><title>特に何もない202602の話</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sat, 28 Feb 2026 19:34:05 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901359325331</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20260228/20260228085723.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>何かを書き残そうとして、気づいたら二月が過ぎようとしていた。危ない。先月の終わりから家族全員で風邪を回し、ハサウェイを観るのが二週間ほど遅くなった。その後、いくつかのプレゼンをしたり、機械装置を組み付けたり、コードを書いたりしていた。いろんなことがあった。何も覚えていない。</p>

<p>自分の中の文章は枯渇していて、なにか原材料を摂取しないといけないという感覚はずっと抱いている。けれどすでに本を読む気力も薄れているためどうしようもない。経験たる経験が必要なのだが、それを経験してもここに書けないことが増え過ぎた。</p>

<p>技術書典20に申し込んだら当選した。またオンラインで出展することにした。今回もAIでなにかをつくっていく。少し前から考えていた、「どんどんアホになるAI」を実装してみたい。何か判断を誤り続けると彼らはどこへ向かってしまうのか。そんなことを表現したい。</p>

<p>いつかgithubにアップロードした個人的な理念を振り返った。つくることでこの世を理解したいのだな私は、と思った。でもつくるだけではだめ。つくり続けなくてはいけない。</p>

<p>ここの記録も同じ。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E5%A4%9C%E6%98%8E%E3%81%91%E3%81%AB%E9%9B%B2%E3%81%AE%E6%B5%B7%E3%81%8B%E3%82%89%E5%B1%B1%E3%80%85%E3%81%8C%E7%8F%BE%E3%82%8C%E3%82%8B-Nk9AlZ5WPu8?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a> <a href="https://unsplash.com/ja/@2879686ki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">ki Zhang</a></p>
]]></content:encoded><description>何かを書き残そうとして、気づいたら二月が過ぎようとしていた。危ない。先月の終わりから家族全員で風邪を回し、ハサウェイを観るのが二週間ほど遅くなった。その後、いくつかのプレゼンをしたり、機械装置を組み付けたり、コードを書いたりしていた。いろんなことがあった。何も覚えていない。 自分の中の文章は枯渇していて、なにか原材料を摂取しないといけないという感覚はずっと抱いている。けれどすでに本を読む気力も薄れているためどうしようもない。経験たる経験が必要なのだが、それを経験してもここに書けないことが増え過ぎた。 技術書典20に申し込んだら当選した。またオンラインで出展することにした。今回もAIでなにかをつ…</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/f21b40ac1adab16a58d9fb32ee762737d4c8ba7b/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20260228%2F20260228085723.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>何かを書き残そうとして、気づいたら二月が過ぎようとしていた。危ない。先月の終わりから家族全員で風邪を回し、ハサウェイを観るのが二週間ほど遅くなった。その後、いくつかのプレゼンをしたり、機械装置を組み付けたり、コードを書いたりしていた。いろんなことがあった。何も覚えていない。 自分の中の文章は枯渇していて、なにか原材料を摂取しないといけないという感覚はずっと抱いている。けれどすでに本を読む気力も薄れているためどうしようもない。経験たる経験が必要なのだが、それを経験してもここに書けないことが増え過ぎた。 技術書典20に申し込んだら当選した。またオンラインで出展することにした。今回もAIでなにかをつ…</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>何かを書き残そうとして、気づいたら二月が過ぎようとしていた。危ない。先月の終わりから家族全員で風邪を回し、ハサウェイを観るのが二週間ほど遅くなった。その後、いくつかのプレゼンをしたり、機械装置を組み付けたり、コードを書いたりしていた。いろんなことがあった。何も覚えていない。 自分の中の文章は枯渇していて、なにか原材料を摂取しないといけないという感覚はずっと抱いている。けれどすでに本を読む気力も薄れているためどうしようもない。経験たる経験が必要なのだが、それを経験してもここに書けないことが増え過ぎた。 技術書典20に申し込んだら当選した。またオンラインで出展することにした。今回もAIでなにかをつ…</itunes:summary></item><item><title>202601の近況</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Thu, 29 Jan 2026 14:20:39 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901348866697</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20260129/20260129142012.jpg" width="1200" height="675" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>何もない日常などないはずもなく、私はふるさとの御神渡りを期待したり、工作機械の中で配管をばらしたり、コードの差分を読み取りかれらを理解しようとしていた。長男の熱が長引き、次男の予定が色々あったため私は久しぶりに会社を休んだ。もう彼の具合は落ち着き、隣で肉まんをほおばっている。すべて一月のことである。</p>

<p>答えをすぐにAIに聞かず、自分の中でとどまらせておくのも良いと気づき出した。問いを発酵させるイメージ。頭にもやがのこるけれど、そうやって脳にストレスをかけておくことで、何かが充足していく気がする。全部気のせいかもしれない。</p>

<p>あしたからガンダムの映画がはじまる。アマプラで前作を復習しておかないといけない。正月に逆シャアを初めて観て、ハサウェイの生い立ちを知った。ちょっと順序が良くない。</p>

<p>脳髄の搾りかすから文章を練り出している気がする。さいきんものを書くのもひどく遅くなっている。これでは良くない。AIに負けたくない。</p>

<p>経験たる経験から文章を生成しよう。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/sxio-HzQMYA?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a> <a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>何もない日常などないはずもなく、私はふるさとの御神渡りを期待したり、工作機械の中で配管をばらしたり、コードの差分を読み取りかれらを理解しようとしていた。長男の熱が長引き、次男の予定が色々あったため私は久しぶりに会社を休んだ。もう彼の具合は落ち着き、隣で肉まんをほおばっている。すべて一月のことである。 答えをすぐにAIに聞かず、自分の中でとどまらせておくのも良いと気づき出した。問いを発酵させるイメージ。頭にもやがのこるけれど、そうやって脳にストレスをかけておくことで、何かが充足していく気がする。全部気のせいかもしれない。 あしたからガンダムの映画がはじまる。アマプラで前作を復習しておかないといけ…</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/fec528c80a4009a5eedd32185d4a0c435871d68f/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20260129%2F20260129142012.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>何もない日常などないはずもなく、私はふるさとの御神渡りを期待したり、工作機械の中で配管をばらしたり、コードの差分を読み取りかれらを理解しようとしていた。長男の熱が長引き、次男の予定が色々あったため私は久しぶりに会社を休んだ。もう彼の具合は落ち着き、隣で肉まんをほおばっている。すべて一月のことである。 答えをすぐにAIに聞かず、自分の中でとどまらせておくのも良いと気づき出した。問いを発酵させるイメージ。頭にもやがのこるけれど、そうやって脳にストレスをかけておくことで、何かが充足していく気がする。全部気のせいかもしれない。 あしたからガンダムの映画がはじまる。アマプラで前作を復習しておかないといけ…</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>何もない日常などないはずもなく、私はふるさとの御神渡りを期待したり、工作機械の中で配管をばらしたり、コードの差分を読み取りかれらを理解しようとしていた。長男の熱が長引き、次男の予定が色々あったため私は久しぶりに会社を休んだ。もう彼の具合は落ち着き、隣で肉まんをほおばっている。すべて一月のことである。 答えをすぐにAIに聞かず、自分の中でとどまらせておくのも良いと気づき出した。問いを発酵させるイメージ。頭にもやがのこるけれど、そうやって脳にストレスをかけておくことで、何かが充足していく気がする。全部気のせいかもしれない。 あしたからガンダムの映画がはじまる。アマプラで前作を復習しておかないといけ…</itunes:summary></item><item><title>AIを使うより自己の脳を鍛える方向にシフトする2025年の年末</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Tue, 30 Dec 2025 19:59:41 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901338379273</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20251230/20251230195650.jpg" width="1200" height="735" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　「ゆっくりするといいよ」と言われ急に自由な時間が二日ほど生まれ取り乱した私は、好きなナポリタンをつくる際に生のシーチキンを投入した箸のまま調理をして見事に腹を下した。年末である。2025年の末はここ五年ほど情熱を注いでいた事項がほどよく埋まり、また新しい窓口が開設された雰囲気もある冬だ。</p>

<p>　生成AIのパワーが日毎に強くなっているし、きっとシンギュラリティは起きちゃっている。それで作ることといえば呟きに添える画像の差し替えとは。やれやれですね。AIがバズワードではなくITレベルで浸透しちゃってるころには、ググれではなくチャッピーに聞いた？がそれになるんだろう。</p>

<p>　この一ヶ月程度の感覚だけど、AIを使いこなすよりも自分の脳をパワーアップさせる方が効率が良い気がする。脳は良い。省エネでハイパワー。なによりインターフェースがいい。念じればいいから。AIを使うとは、それっぽいことを喋る野郎を相手にすることだ。だから文章を整えてあげないといけない。文脈を整え、スコープを揃え、方法要領を正しく伝える。なんて面倒くさいんだ。アジャイルを目指していたらウォーターフォールになるんですね。そんなことはないか。</p>

<p>　脳をパワーアップさせるにはどうするか。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fnote.com%2Fsimplearchitect%2Fn%2Fnadc0bcdd5b3d" title="凄いやつになる方法｜牛尾　剛" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://note.com/simplearchitect/n/nadc0bcdd5b3d">note.com</a></cite></p>

<p>　この人の記事を読んだ。「脳に負荷をかける」。それだ。なんか言いたいことがまとめられていた。最近は目にばかり負荷がかかっていた。スマホで不要不急な動画を漁るばかり。脳は疲れてないのに目が疲れる。よくないな。あとは、すぐにメモを書くのはよくないらしい。昔、「メモの魔力」なんて本が売れていたのに。</p>

<p>　それなら目以外のインターフェースを使ってメモらずにアウトプットをすれば最強になれるのでは。そう感じた。そういった理屈で音声配信を始めることにした。</p>

<iframe data-testid="embed-iframe" style="border-radius:12px" src="https://open.spotify.com/embed/episode/3BRLq67IXCwpnvULuiEttB?utm_source=generator" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>


<p>以前もnoteでやってはいたが、今回は目的が違う。脳を強くする！そんなかんじに生きることにした。音声配信の良いところはその文章量である。2000字程度のブログなんて、五分程度あれば喋り切ってしまう。だから20分くらい喋るとなると、もっとたくさんのことを仕入れて話す。そして台本は読まずに頭の中に全部入れておく。結構脳が鍛えられる気がしてきた。</p>

<p>二週間に一回程度の頻度で投稿できたらいいな、と思う。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E5%A4%95%E6%9A%AE%E3%82%8C%E3%81%AE%E9%9B%AA%E5%B1%B1%E8%84%88%E3%81%A8%E8%89%B2%E9%AE%AE%E3%82%84%E3%81%8B%E3%81%AA%E7%A9%BA-6XM8GFreifo?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>「ゆっくりするといいよ」と言われ急に自由な時間が二日ほど生まれ取り乱した私は、好きなナポリタンをつくる際に生のシーチキンを投入した箸のまま調理をして見事に腹を下した。年末である。2025年の末はここ五年ほど情熱を注いでいた事項がほどよく埋まり、また新しい窓口が開設された雰囲気もある冬だ。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/69d2ffa03edbc8b7df66896f6e8eb61594ec194b/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20251230%2F20251230195650.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>「ゆっくりするといいよ」と言われ急に自由な時間が二日ほど生まれ取り乱した私は、好きなナポリタンをつくる際に生のシーチキンを投入した箸のまま調理をして見事に腹を下した。年末である。2025年の末はここ五年ほど情熱を注いでいた事項がほどよく埋まり、また新しい窓口が開設された雰囲気もある冬だ。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>「ゆっくりするといいよ」と言われ急に自由な時間が二日ほど生まれ取り乱した私は、好きなナポリタンをつくる際に生のシーチキンを投入した箸のまま調理をして見事に腹を下した。年末である。2025年の末はここ五年ほど情熱を注いでいた事項がほどよく埋まり、また新しい窓口が開設された雰囲気もある冬だ。</itunes:summary></item><item><title>フィヨルドブートキャンプの卒業とこれからのこと</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Tue, 2 Dec 2025 07:00:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901326959514</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20251130/20251130103721.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>子供がCOSMOSという合唱曲をよく歌っている。１００億年という単語が出てくるが相当長い時間であるためあまり感覚がつかめない。彼はさらりと流してしまうが、途方も無いスケールの歌だなと聞いていた。それに比べてこの数年なんて塵にも満たないはずなのに、本当にいろんなことがあった。</p>

<p><a href="https://fjord-calendar.jp/calendars/2025">&#x30D5;&#x30A3;&#x30E8;&#x30EB;&#x30C9;&#x30D6;&#x30FC;&#x30C8;&#x30AD;&#x30E3;&#x30F3;&#x30D7; Advent Calendar 2025 | Fjord Calendar</a></p>

<p>そう。これはフィヨルドブートキャンプアドベントカレンダー2025の記事だった。</p>

<p>今年の七月にオンラインのプログラミングスクール、フィヨルドブートキャンプを卒業した。二年かかった。当初はITエンジニアに転職するために入ったのだが、勉強していくなかで年をとり、もう転職は無理かなと思った。それでも退会しなかったのは、単なる意地である。あとは卒業できればいつでもブートキャンプアプリを閲覧することができるというのも大きい。なんかもったいなかった。</p>

<p>もう半年経ったので、難しかったプラクティスの思い出や、記憶に残っているイベントなどはなにひとつない。すでに忘れた。過去のことはコードが覚えているはずなので、私は前を向き続けないといけない。そういった理由でAIと一緒に個人開発をしたり、その体験談をまとめて技術書典に出したりした。まだやることは多い。</p>

<p>AIがなんでもやってくれるようになり、私たちはプロンプトをうつマシンになりさがったか。そんなことはない。彼らは文脈を適切に所有しない、賢いバカだ。ターミナルを閉じるとすべてのコンテキストが消し飛ぶこともあった。これは私の使用方法に誤りがあった。自分の脳みそに情報を詰め込む方がSDGsの面で優っている。脳は非常にエコな構造。マシンはまだ私たちの脳を模倣できていない。</p>

<p>私はコードを書くときに人生の良さを感じる。コードと共に生きるのがしっくりくるのだ。特別好きと言うわけでもないけれど、嫌いでは無い。フィヨルドブートキャンプを卒業できたのは、このような消極的意欲のおかげに他ならない。</p>

<p>これからのことは、これからの私が考えることで、今の私は考えない。というのはタイトルと不一致なので少しだけ想像する。来年もおそらくコードを書いていると思う。判断をAIに委ねるのはなるべくしないようにする。それには彼らより賢くなくてはだめで、賢さをあげるには文章や言葉によって思想を具体化したほうがいい。</p>

<p>常に発信活動をしていこう。常時。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E9%9B%AA%E3%81%AB%E8%A6%86%E3%82%8F%E3%82%8C%E3%81%9F%E5%B1%B1%E3%80%85%E3%81%AE%E4%B8%8A%E3%81%AB%E6%98%9F%E7%A9%BA%E3%81%8C%E5%BA%83%E3%81%8C%E3%82%8B-ktllNfb9cBs?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>子供がCOSMOSという合唱曲をよく歌っている。１００億年という単語が出てくるが相当長い時間であるためあまり感覚がつかめない。彼はさらりと流してしまうが、途方も無いスケールの歌だなと聞いていた。それに比べてこの数年なんて塵にも満たないはずなのに、本当にいろんなことがあった。 フィヨルドブートキャンプ Advent Calendar 2025 | Fjord Calendar そう。これはフィヨルドブートキャンプアドベントカレンダー2025の記事だった。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/d71e03fd79fac186ad07b8198d66551e5a94a21f/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20251130%2F20251130103721.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>子供がCOSMOSという合唱曲をよく歌っている。１００億年という単語が出てくるが相当長い時間であるためあまり感覚がつかめない。彼はさらりと流してしまうが、途方も無いスケールの歌だなと聞いていた。それに比べてこの数年なんて塵にも満たないはずなのに、本当にいろんなことがあった。 フィヨルドブートキャンプ Advent Calendar 2025 | Fjord Calendar そう。これはフィヨルドブートキャンプアドベントカレンダー2025の記事だった。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>子供がCOSMOSという合唱曲をよく歌っている。１００億年という単語が出てくるが相当長い時間であるためあまり感覚がつかめない。彼はさらりと流してしまうが、途方も無いスケールの歌だなと聞いていた。それに比べてこの数年なんて塵にも満たないはずなのに、本当にいろんなことがあった。 フィヨルドブートキャンプ Advent Calendar 2025 | Fjord Calendar そう。これはフィヨルドブートキャンプアドベントカレンダー2025の記事だった。</itunes:summary></item><item><title>エンジニアとしての日常を生きる</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Mon, 1 Dec 2025 07:00:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901326958924</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20251130/20251130103555.jpg" width="1200" height="788" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>諸君らが愛してくれた秋は死んだ。なぜだ。暑いばかりの夏はとうに過ぎ去り、凍えるだけの季節になってしまった。少しだけ朝起きるのが苦手になって、私はコードや文書を書けないことに悲しくなった。そのようなものだ。</p>

<p>もう12月となったのでアドベントカレンダーを書いていかないといけない風潮である。今年もエンジニアと人生アドベントカレンダーに参加した。エンジニアとしての日常を生きる。</p>

<p><a href="https://adventar.org/calendars/12244">&#x30A8;&#x30F3;&#x30B8;&#x30CB;&#x30A2;&#x3068;&#x4EBA;&#x751F; Advent Calendar 2025 - Adventar</a></p>

<h1 id="エンジニアとは何か">エンジニアとは何か</h1>

<p>コミュニティの人たちの属性はITエンジニアが多い。私はITではなく、メカニカルな機械系のエンジニアだが、「エンジニアになりたいな」などと思っていた。しかし、そんな線引きはまったく幻想のまぼろしの虚であって、自分で適当に区分を設けただけだった。エンジニアを覗く時、エンジニアもまたこちらを覗いているのだ。まったく訳がわからない。</p>

<p>昔技術士の勉強をしていたとき、技術士の本分とは技術的な課題を解決することなんだよ、ということを知った。そうだった。みんなが困っていることを解決すればいい。その手段としてITを駆使したり、メカニカルなからくりをつくったりしているだけだった。やっぱり私もエンジニアだった。</p>

<p>自分の像がそれとなくわかってきた2025年であり、ある程度決心というか諦めがついたのも2025年。しかし、諦めたときに思わぬ方向からいいかんじの風がやってきて、それに持ち上げられつつあるのも2025年なのだ。詳細を書くのは難しいが、今年は自分のキャリアの方面でいろいろと変化があった。</p>

<h1 id="理念の設定">理念の設定</h1>

<p>私のキャリアや課題についてChatGPTと壁打ちを続けていた。彼はあたりさわりのないことを言ってくる。私が望む答えしか言ってこない気がしてきたので、「忖度するな、お世辞を言うな、真実を言え」というプロンプトを設定した。まったく答えが変わった。ClaudeCodeも開発方針や指針によっていかようにでもコードが変わる。これは私自身のなかにもブレない理念を持つ必要があるなと思った。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fgithub.com%2Fkyokucho1989" title="kyokucho1989 - Overview" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://github.com/kyokucho1989">github.com</a></cite></p>

<blockquote><h1 id="理念">理念</h1>

<p>つくる。より良くつくる。</p>

<h1 id="詳細">詳細</h1>

<ul>
<li>考える。言葉によって考える。</li>
<li>動く。行動は機会を導く。</li>
<li>休む。余白は自身を補完する。</li>
<li>伝える。他者の視点に立つ。</li>
<li>良さ。良さはすべてを越える。</li>
</ul>
</blockquote>

<p>このようにした。理念があって初めてその後の実装が出来上がるのだろう。</p>

<h1 id="理念に基づいた行動">理念に基づいた行動</h1>

<p>理念を設定することで見えてくるものがある。私は他者にそこまで興味がないが、イベントは積極的に参加しようと考えていたり、登壇駆動・締切駆動をこよなく愛する人物であった。変なの。そういったわけで、技術書典19にオンライン参加して書籍を売ってみた。オンライン販売なので原価はゼロだ。</p>

<p><a href="https://techbookfest.org/product/hny8NEJ8kxte5K5zEWXaBn?productVariantID=6SmTadUg7HY79GytQDrqr2">AI&#x3068;&#x5171;&#x306B;&#x5F37;&#x304F;&#x306A;&#x308B;&mdash;&#x306F;&#x3058;&#x3081;&#x3066;&#x306E;Claude Code&#x4F53;&#x9A13;&#x8A18;&mdash;&#xFF1A;kyokucho1989</a></p>

<p>そして何冊か売れたのでわたしは「嬉しいな」と思った。味を占めたので今後は毎回参加することにした。</p>

<p>結局はつくるのが好きな人間だった。つくることで未来を実装してしまえ。そんな雰囲気もある。</p>

<h1 id="今後の私を妨げるもの制約と誓約">今後の私を妨げるもの、制約と誓約</h1>

<p>今年もかなりの動きがあったが、来年もひどそうだ。しかしこれが毎回うまくいくわけではなく、障害は多い。一番は子供か。彼の性質上、加齢によって落ち着くとかそんなレベルではない。「もう育児のフェーズは終わって、（子供の）介護になったね」と妻と話している。朝の2時に起きてくる子とやりあったり、6年目のトイレトレーニングをしたりして日々を生きている。</p>

<p>しかし彼がいたからこそ、より集中して物事に取り組めるようになったのも事実だ。頭の中で実装したり文章を整えたり分解して、空いた時間で一気に形に仕上げる。制約と誓約である。</p>

<p>「逃げるな、生きる方が戦いだ」とカガリは言ったが、エンジニアとして現実と向き合わなくてはいけない。常に健康で、どこにも敵はおらず、時間と金はいくらでも使える！そんなことはない。予算納期品質社内外家族友人それらを天秤にかけながら、どれを選んでも正答となる4つの選択肢を持ち、一つを選ぶ！そんな感じで生きていく。これが現実。</p>

<p>やっていこう。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E8%89%B2%E9%AE%AE%E3%82%84%E3%81%8B%E3%81%AA%E5%A4%95%E7%84%BC%E3%81%91%E3%81%AE%E7%A9%BA%E3%81%AE%E4%B8%8B%E3%81%AB%E9%9B%AA%E3%82%92%E9%A0%82%E3%81%8F%E5%B1%B1%E3%80%85-pCnD1iJg5EE?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>諸君らが愛してくれた秋は死んだ。なぜだ。暑いばかりの夏はとうに過ぎ去り、凍えるだけの季節になってしまった。少しだけ朝起きるのが苦手になって、私はコードや文書を書けないことに悲しくなった。そのようなものだ。 もう12月となったのでアドベントカレンダーを書いていかないといけない風潮である。今年もエンジニアと人生アドベントカレンダーに参加した。エンジニアとしての日常を生きる。 エンジニアと人生 Advent Calendar 2025 - Adventar</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/1c70ed650fb5ad8518467767d86b62b078861179/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20251130%2F20251130103555.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>諸君らが愛してくれた秋は死んだ。なぜだ。暑いばかりの夏はとうに過ぎ去り、凍えるだけの季節になってしまった。少しだけ朝起きるのが苦手になって、私はコードや文書を書けないことに悲しくなった。そのようなものだ。 もう12月となったのでアドベントカレンダーを書いていかないといけない風潮である。今年もエンジニアと人生アドベントカレンダーに参加した。エンジニアとしての日常を生きる。 エンジニアと人生 Advent Calendar 2025 - Adventar</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>諸君らが愛してくれた秋は死んだ。なぜだ。暑いばかりの夏はとうに過ぎ去り、凍えるだけの季節になってしまった。少しだけ朝起きるのが苦手になって、私はコードや文書を書けないことに悲しくなった。そのようなものだ。 もう12月となったのでアドベントカレンダーを書いていかないといけない風潮である。今年もエンジニアと人生アドベントカレンダーに参加した。エンジニアとしての日常を生きる。 エンジニアと人生 Advent Calendar 2025 - Adventar</itunes:summary></item><item><title>いまさらだけどDockerについて調べる</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sun, 23 Nov 2025 07:53:07 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901324273480</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20251123/20251123074829.jpg" width="1200" height="630" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>環境は変わっていないくせに、自分がやりたいことがどんどん実現していく様はさながら魔法である。Githubの自己紹介ページに掲げた理念においては、思考は文章であると述べている。新しい知識が脳内に増えていくが、どこかでそれを書き留めておかなくてはいけない。今日はDockerについて少しだけまとめる。</p>

<p>Dockerとはなにか。</p>

<p><a href="https://www.docker.com/resources/what-container/">What is a Container? | Docker</a></p>

<p><a href="https://knowledge.sakura.ad.jp/13265/">Docker&#x5165;&#x9580;&#xFF08;&#x7B2C;&#x4E00;&#x56DE;&#xFF09;&#xFF5E;Docker&#x3068;&#x306F;&#x4F55;&#x304B;&#x3001;&#x4F55;&#x304C;&#x826F;&#x3044;&#x306E;&#x304B;&#xFF5E; | &#x3055;&#x304F;&#x3089;&#x306E;&#x30CA;&#x30EC;&#x30C3;&#x30B8;</a></p>

<blockquote><p>コンテナ型の仮想環境を作成、配布、実行するためのプラットフォームです。</p></blockquote>

<p>なるほど。開発環境をローカルではなく仮想環境上に構築し、それを配布・実行するための仕組みということか。</p>

<p>Dockerのコンテナと比較されるのが仮想マシンという概念である。仮想マシンはホストマシン上にHypervisorという司令塔を入れて、複数のゲストOSらに指示を出して、アプリ等を動かしていた。ゲストOSは独自のカーネルを持つため、ホストとは別のOSが1つのマシン上で動いている状態になる。しかしこの構成ではゲストOSの分サイズが大きく、処理も遅くなってしまうという難点があった。</p>

<p>一方、Docker コンテナは、独自のカーネルを持たない。カーネルはホストOSのものを共有して利用する。そのためサイズが小さく処理が早いというメリットがある。</p>

<h1 id="なぜコンテナがでてきたか">なぜコンテナがでてきたか</h1>

<p>ChatGPTにききながらすこしまとめた。なぜ最初からコンテナが出てこなかったのか。技術的問題と社会のニーズによるところが多かったようだ。コンテナを実装するにはカーネルのなかに隔離技術がないとダメだった。名前空間やリソースの制御が必要だった。社会的にもカーネルの共有は危険とかリスクが高いとかそんな懸念があった。</p>

<h1 id="技術は一足とびではない">技術は一足とびではない</h1>

<p>調べていくと一つの技術がポンと出たわけではなく、社会事情や技術革新とかがあって新しいものができてきたのだなと知った。これはハードウェアと一緒か。紡織から自動車業が発展したように。私もがんばろう。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E9%BB%84%E8%89%B2%E3%81%84%E8%8A%B1%E7%95%91%E3%81%AE%E4%B8%8A%E3%81%AB%E9%9B%84%E5%A4%A7%E3%81%AA%E5%B1%B1%E3%81%8C%E3%81%9D%E3%81%B3%E3%81%88%E7%AB%8B%E3%81%A3%E3%81%A6%E3%81%84%E3%81%BE%E3%81%99-pSoAFJ-T6ic?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>環境は変わっていないくせに、自分がやりたいことがどんどん実現していく様はさながら魔法である。Githubの自己紹介ページに掲げた理念においては、思考は文章であると述べている。新しい知識が脳内に増えていくが、どこかでそれを書き留めておかなくてはいけない。今日はDockerについて少しだけまとめる。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/16879c95962046344d74024a62575578543091de/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20251123%2F20251123074829.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>環境は変わっていないくせに、自分がやりたいことがどんどん実現していく様はさながら魔法である。Githubの自己紹介ページに掲げた理念においては、思考は文章であると述べている。新しい知識が脳内に増えていくが、どこかでそれを書き留めておかなくてはいけない。今日はDockerについて少しだけまとめる。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>環境は変わっていないくせに、自分がやりたいことがどんどん実現していく様はさながら魔法である。Githubの自己紹介ページに掲げた理念においては、思考は文章であると述べている。新しい知識が脳内に増えていくが、どこかでそれを書き留めておかなくてはいけない。今日はDockerについて少しだけまとめる。</itunes:summary></item><item><title>技術書典19でClaudeCodeの本を出すことにした</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Thu, 13 Nov 2025 05:23:17 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901317005005</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20251112/20251112054205.jpg" width="1200" height="675" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>11月も始まったばかりだと思っていたが、もう中旬になっていた。先日はポッキーとプリッツの日だったが特に何事もなく過ぎていく。そういえば小学生の頃にだれかがその日が11月11日だと気づいて、みんなで11時11分の時に「ポッキー！」と叫んだ記憶がある。先生は困惑していた。</p>

<p>技術書典19にむけて書いていた原稿が完成し、今週末から販売できるようになった。オフラインでの出品はせずに、オンラインのみ。すこしさびしいけど、本を出すのは面白いなと思った。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Ftechbookfest.org%2Fproduct%2Fhny8NEJ8kxte5K5zEWXaBn" title="AIと共に強くなる—はじめてのClaude Code体験記—：kyokucho1989" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://techbookfest.org/product/hny8NEJ8kxte5K5zEWXaBn">techbookfest.org</a></cite></p>

<p>これ。ClaudeCodeをつかった開発記録をせきららに書く。生成AIはこの数年ですごい勢いでみなが使うようになり、ChatGPTに関しては生活に溶け込みつつある。コーディングとAIは本当に相性が良く、彼らは既存のコードを調査し、適切な設計をしてくれる。はず。でもそうじゃないかも。</p>

<p>便利な使い方や、最強のプロンプトを紹介する本ではなく、本当に自分が感じたことを淡々とまとめている。でも頑張って書いたのでぜひ買ってほしい。</p>

<p>やり方がだいぶわかってきたので、来年も出すぞ。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/AvFJkZrsnkY?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a> <a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>11月も始まったばかりだと思っていたが、もう中旬になっていた。先日はポッキーとプリッツの日だったが特に何事もなく過ぎていく。そういえば小学生の頃にだれかがその日が11月11日だと気づいて、みんなで11時11分の時に「ポッキー！」と叫んだ記憶がある。先生は困惑していた。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/3640e150e85834153ab6c5475c2ecc7d388ce61a/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20251112%2F20251112054205.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>11月も始まったばかりだと思っていたが、もう中旬になっていた。先日はポッキーとプリッツの日だったが特に何事もなく過ぎていく。そういえば小学生の頃にだれかがその日が11月11日だと気づいて、みんなで11時11分の時に「ポッキー！」と叫んだ記憶がある。先生は困惑していた。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>11月も始まったばかりだと思っていたが、もう中旬になっていた。先日はポッキーとプリッツの日だったが特に何事もなく過ぎていく。そういえば小学生の頃にだれかがその日が11月11日だと気づいて、みんなで11時11分の時に「ポッキー！」と叫んだ記憶がある。先生は困惑していた。</itunes:summary></item><item><title>第二種電気工事士と10月</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Fri, 31 Oct 2025 05:49:23 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/17179246901307109099</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20251030/20251030045759.jpg" width="1200" height="713" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　通勤電車のルートでスマホが圏外になるエリアがあって、その時だけは皆が遠くを見つめている気がした。けれど既に外は暗くなっていて、私はガラスに映る私を把握するほかはなかった。10月も終わりである。</p>

<p>　前回の記事のアンサー記事になるような構成だが、技術書典19に出す原稿が完成した。物理本は出さないのでデータだけ登録して、いまは審査待ち。問題なければ来週末くらいには電子マーケット上に並べることができるだろう。そうしたらもう少し宣伝する。わりと気軽に本が出せるのは良い。オンラインなら費用をかけずに出店することができるし。</p>

<p>　最近つくった自分の理念の中に、「考える。言葉によって考える。」というフレーズがある。思考とは言葉というのはウィトゲンシュタイン的なあれだけど本当にそう。考えるにはとにかく言葉にしなくてはいけないし、言葉がないと考えることにはつながらない。締め切り駆動開発で毎年二回は強制的に本を出せるので、これからも毎回出そうと思う。</p>

<p>　電気工事士二種の実技試験に向けて練習をしている。図面を読み取って配線図をかき、それに従ってケーブルの被膜をとったり配線したりしないといけない。道具は一通り揃えたのでいざやってみようとしたが、まったく意味がわからない。Youtubeにあった解説動画の通りにやってみる。</p>

<iframe src="https://www.youtube.com/embed/bsnfRInf9eU?enablejsapi=1" width="560" height="315" frameborder="0" allowfullscreen></iframe>


<p><br><a href="https://www.youtube.com/watch?v=bsnfRInf9eU">www.youtube.com</a></p>

<p>　難しいが、なんとなくわかってきた。針を知らない人間がいちから裁縫を習うとしたらこんな感じなんだろうな。一連の作業を分解し、さらにそれぞれの要素作業がある。体に覚え込ませるのが最適だろうが、果たして私にそのような時間があるだろうか。工具を10分でも机に広げていたら、たちまち子供が寄ってきて邪魔をする。長男はちょっかいを出してくるし、次男の前では見せないことにしている。いろいろ口に入れそうだ。</p>

<p>　時間が足りないなぁ。足りないなかやればいいか。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E5%B2%A9%E3%81%A0%E3%82%89%E3%81%91%E3%81%AE%E4%B8%98%E3%81%AE%E4%B8%AD%E8%85%B9%E3%82%84%E5%B1%B1%E3%80%85%E3%81%AB%E5%9B%B2%E3%81%BE%E3%82%8C%E3%81%9F%E3%82%BF%E3%83%BC%E3%82%B3%E3%82%A4%E3%82%BA%E3%83%96%E3%83%AB%E3%83%BC%E3%81%AE%E6%B9%96-GvuuoqQpE8o?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Marek Piwnicki</a></p>
]]></content:encoded><description>通勤電車のルートでスマホが圏外になるエリアがあって、その時だけは皆が遠くを見つめている気がした。けれど既に外は暗くなっていて、私はガラスに映る私を把握するほかはなかった。10月も終わりである。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/11f8463aa1fab5ce2b10c398fe0f137612f94803/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20251030%2F20251030045759.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>通勤電車のルートでスマホが圏外になるエリアがあって、その時だけは皆が遠くを見つめている気がした。けれど既に外は暗くなっていて、私はガラスに映る私を把握するほかはなかった。10月も終わりである。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>通勤電車のルートでスマホが圏外になるエリアがあって、その時だけは皆が遠くを見つめている気がした。けれど既に外は暗くなっていて、私はガラスに映る私を把握するほかはなかった。10月も終わりである。</itunes:summary></item><item><title>散らばった文章でも残したい場合もある</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Wed, 8 Oct 2025 17:00:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802888565278294904</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20251008/20251008090808.jpg" width="1200" height="750" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>今年もまたりんご狩の季節となった。一時間ほど車を走らせて山あいの畑に行くと、すでにたくさんのりんごが実っていた。私たちはきれいな形のものをいくつかもぎ取って、そのまま口に入れた。今回は次男は逃げ出さず、みなといっしょにりんごを堪能していた。</p>

<p>第二種電気工事士という資格試験を受けることにした。この資格を手に入れれば、低圧の電気工事が可能となる。家庭のコンセントの付け替えや、エアコンの工事もできそうだ。それもいいが、会社から資格手当が出るのが良い。参考書を買って、よくわからない知識を詰め込んだ。記号や使われる条件を覚える。計算問題もあるが、それほど難しくない。筆記試験をこの間受けて、合格した。よかった。次は実技を受ける。</p>

<p>試験が終わったので、次は技術書典の原稿を書かなくてはいけない。内容も考えないといけないが、執筆環境を作る必要がある。以前コミュニティで本を出した時はRe:Viewというツールを使っていた。あれを導入しよう。AIに聞きながら手順をさぐっていく。どうやっても時間が足りない気がするが、それはその時の自分がなんとかするはずだ。私は知らない。</p>

<p>りんごの話だが、持っていたiPhoneが壊れた。SIMを認識しなくなったのだ。修理屋に持って行くと、どうも物理的にSIMを読み取れないようになっちゃったらしい。以前から認識できないことがあったので、そうなのだろう。基盤のどこかがやきついたとかそんなこのか。背面システムの全交換が必要になるようで、ちょっとしたスマホが買えるくらいの金額だった。一旦は家に落ちてた昔のケータイにSIMを入れて生活しているが、やはりiPhoneが欲しいなと思う。</p>

<p>最近は仕事が落ち着いてしまって、忙しくない。忙しいのは良くないけど、忙しくないのも良くない。自分をある程度忘れている方が、余計な悩みも少なくなる。自己実現とか。難しいですね。</p>

<p>iPhoneか。新しいスマホがあれば全て解決するのか。技術書典に本を出して、その収益でもってiPhoneを買おう。小さな願いですね。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E3%83%91%E3%82%B9%E3%83%86%E3%83%AB%E3%82%AB%E3%83%A9%E3%83%BC%E3%81%AE%E7%A9%BA%E3%81%AE%E4%B8%8B%E3%81%AB%E9%87%8D%E3%81%AD%E3%82%89%E3%82%8C%E3%81%9F%E9%9D%92%E3%81%84%E5%B1%B1%E3%80%85-7c4Gxa6598I?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>今年もまたりんご狩の季節となった。一時間ほど車を走らせて山あいの畑に行くと、すでにたくさんのりんごが実っていた。私たちはきれいな形のものをいくつかもぎ取って、そのまま口に入れた。今回は次男は逃げ出さず、みなといっしょにりんごを堪能していた。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/b2305e2f5a353d9c3436fbd9945d19fd000266bd/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20251008%2F20251008090808.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>今年もまたりんご狩の季節となった。一時間ほど車を走らせて山あいの畑に行くと、すでにたくさんのりんごが実っていた。私たちはきれいな形のものをいくつかもぎ取って、そのまま口に入れた。今回は次男は逃げ出さず、みなといっしょにりんごを堪能していた。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>今年もまたりんご狩の季節となった。一時間ほど車を走らせて山あいの畑に行くと、すでにたくさんのりんごが実っていた。私たちはきれいな形のものをいくつかもぎ取って、そのまま口に入れた。今回は次男は逃げ出さず、みなといっしょにりんごを堪能していた。</itunes:summary></item><item><title>サメの魔人は水の呼吸もできる/AIはコンテキスト勝負だけど結局主人公補正で人間が強い</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Tue, 23 Sep 2025 06:37:46 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802888565249369650</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250923/20250923060638.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　朝起きて作業をし始めると、自分が自由に扱える時間は今しかないのだなと気づいた。平日でも休日でも子供が起きてくれば全ての作業は中断され、そこからバタバタと一日が始まってしまうのだ。それは一時的なものではなく、最低でもあと五年は続く恒久的なものであるから、自覚しよう。</p>

<p>　集中するとかしないとか、それ以前の話で、まずはやらないといけない。</p>

<p>　技術書典への出版用にClaudeCodeとともにコードを書いているが、面白い感覚ではある。記憶障害を持っている研究者を相手にしているようだ。「博士の愛した数式」という小説にでてくる博士のようだが、ターミナルを閉じればその記憶は無くなってしまう。ではなにを参照しているのかというと、仕様書とも呼べる<code>CLAUDE.md</code>や成果物であるコード自体である。だから、「昨日のあれ、やっといて」では伝わらない。この辺りはChatGPTとは異なるところだ。</p>

<p>　可能な限りコンテキストが続くように、データを保存していけばいいのかもしれない。たとえ私がすぐに忘れるような人間になったとしてもAIがそれを覚えていられるくらいに。</p>

<p>　AIを使ったコーディングを通して、私もAIと共に成長したいと思っていたが、彼らは成長しないのかもしれない。私がコンテキストを渡すのが上手くなればそれでいいだけの話か。</p>

<p>　結局は自分の頭に知識を詰め込んでいかないといけない。手は増えたが、頭は増えない。AIに渡せるのは仕様書のみであって、根本となる考え方や正しさはすべてこちらが持とう。彼らは神ではなく先生でもなく、優秀な部下である。</p>

<p>　タイトルに言及してなかった。チェンソーマンの映画を観てきた。非常に良かった。アクションシーンが芸術的でもあり、かっこよかったけど、原作ではどんな絵の構成になっていたか思い出せない。読み直そうかな。</p>

<p>　サメの魔人であるビームは、ちょっと頭弱いけど今回はかなり活躍していた。ひとえにデンジへの忠誠心によるものだと思う。彼はAIとは違うので、デンジが明確に方針を示さなくてもいい感じに戦ってくれ、彼の意思を汲み取って行動してくれる。全然死なないし、やっぱり強い。</p>

<p>　AIはもちろん強いけど、より強いのはサメの魔人なのかな。でも頭のネジが外れまくっているデンジみたいなやつが最強なんだろう。コーディングも。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E5%B5%90%E3%81%AE%E8%89%B2%E3%81%A8%E3%82%8A%E3%81%A9%E3%82%8A%E3%81%AE%E7%A9%BA%E3%81%AE%E4%B8%8B%E3%81%AE%E3%81%B2%E3%81%BE%E3%82%8F%E3%82%8A%E7%95%91-t_VkKLO9Fqo?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@philipp_dice?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Philipp Düsel</a></p>
]]></content:encoded><description>朝起きて作業をし始めると、自分が自由に扱える時間は今しかないのだなと気づいた。平日でも休日でも子供が起きてくれば全ての作業は中断され、そこからバタバタと一日が始まってしまうのだ。それは一時的なものではなく、最低でもあと五年は続く恒久的なものであるから、自覚しよう。 集中するとかしないとか、それ以前の話で、まずはやらないといけない。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/5f6e2626523220d34209bbddacd6d24669f358a5/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250923%2F20250923060638.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>朝起きて作業をし始めると、自分が自由に扱える時間は今しかないのだなと気づいた。平日でも休日でも子供が起きてくれば全ての作業は中断され、そこからバタバタと一日が始まってしまうのだ。それは一時的なものではなく、最低でもあと五年は続く恒久的なものであるから、自覚しよう。 集中するとかしないとか、それ以前の話で、まずはやらないといけない。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>朝起きて作業をし始めると、自分が自由に扱える時間は今しかないのだなと気づいた。平日でも休日でも子供が起きてくれば全ての作業は中断され、そこからバタバタと一日が始まってしまうのだ。それは一時的なものではなく、最低でもあと五年は続く恒久的なものであるから、自覚しよう。 集中するとかしないとか、それ以前の話で、まずはやらないといけない。</itunes:summary></item><item><title>締切駆動開発で本を書く——技術書典19 にエントリーした</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Thu, 18 Sep 2025 11:30:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802888565237133512</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250917/20250917053654.jpg" width="1200" height="549" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　文章を書く気力が湧かない、というのは気のせいであって、ワンセンテンスを捻り出せばあとはどうにでもなることがある。朝は少しだけ涼しい時間もできてきて、駅のホームで待たされても汗をかくことが少なくなった。</p>

<p>　プログラミングスクールを卒業してから、かなり時間が余るようになった。PCに触れる時間帯は常に課題のためのコーディングをしていたため、それがなくなるとびっくりするほど暇になった。このまま遊び呆けるのも良いけれど、せっかくだから何か別のことをしたい。</p>

<p>　締切駆動開発、イベント駆動開発という言葉がある。成果物のない状態で創作関係のイベントにエントリーしてしまい、そこからものを作ることだ。私は何かに追われていないと生を実感できないのだろう。そういった理由で、技術書典19に参加登録をした。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Ftechbookfest.org%2F" title="技術書典：技術書オンリーイベント" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://techbookfest.org/">techbookfest.org</a></cite></p>

<p>　これは技術系の書籍を作って売る同人イベントだ。コミケの技術書バージョン。以前、FarmtoryLabやエンジニアと人生コミュニティで合同で本を出した記憶がある。自分は原稿を出しただけだったが、あとで物理本を送ってもらえて、それは今でも本棚に残っている。楽しかった。</p>

<p>　まだ当落状況は未確定だが、本の内容はだいたい決めた。AIのことを書く。文章はいきなりたくさん書けないので、ここのブログに少しずつ投下していって、あとでまとめるようにしたい。</p>

<p>　漫然とAIを使うのではなく、主体的に使ってともに成長できるようになりたい。それには言語化が必要だ。自分が何をしたいのか、なぜそのコードを選択したのか。表現できるようになれば強い。そういったわけで、開発記録をログに残し、それをAIが読み込んで追記してくれるような開発スタイルを試みることにした。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fgithub.com%2Fkyokucho1989%2FbreakoutAI" title="GitHub - kyokucho1989/breakoutAI: AIを取り入れたブロック崩し" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://github.com/kyokucho1989/breakoutAI">github.com</a></cite></p>

<p>こんな感じ。</p>

<blockquote><h2 id="記録">記録</h2>

<h3 id="開発記録-by-Claude">開発記録 (by Claude)</h3>

<p>各フェーズの進捗は <code>/history-by-claude/yyyymmdd.md</code> 形式で記録し、技術的な決定の根拠と学習内容を明確に文書化します。</p>

<p>どのようなプロンプトを与えられ、何を生成したかを残します。
また、「こうすればより効果的だったのに」というプロンプトがあれば、それも合わせて教えてください。</p>

<h3 id="開発記録-by-人間">開発記録 (by 人間)</h3>

<p>開発者が学習したことを <code>/history-human/yyyymmdd.md</code> 形式で記録します。内容は以下の通り。</p>

<pre><code># 人間による記録
~~~~

# Claudeによる指摘

~~~~
</code></pre>

<p>「人間による記録」は人間が書きます。そこに過不足があれば「Claudeによる指摘」を書いてください。記載するタイミングはこちらが指示します。</p></blockquote>

<p>人間が書き、AIが指摘する。足りないところはAIが補い、AIが見落としたところは人間が拾う。二人三脚のように、コードも文章も育てていく。</p>

<p>小さなログが積み重なり、やがて一冊の本になる。そう思うと、今から少し胸が高鳴る。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/TB1IaqcYNyM?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>文章を書く気力が湧かない、というのは気のせいであって、ワンセンテンスを捻り出せばあとはどうにでもなることがある。朝は少しだけ涼しい時間もできてきて、駅のホームで待たされても汗をかくことが少なくなった。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/342cbbfac3028bc6f6a184a4415c570e0a227357/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250917%2F20250917053654.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>文章を書く気力が湧かない、というのは気のせいであって、ワンセンテンスを捻り出せばあとはどうにでもなることがある。朝は少しだけ涼しい時間もできてきて、駅のホームで待たされても汗をかくことが少なくなった。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>文章を書く気力が湧かない、というのは気のせいであって、ワンセンテンスを捻り出せばあとはどうにでもなることがある。朝は少しだけ涼しい時間もできてきて、駅のホームで待たされても汗をかくことが少なくなった。</itunes:summary></item><item><title>Render.comからFly.ioへ：PostgreSQLデータベースを移行する手順</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sat, 30 Aug 2025 15:04:23 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398517716224</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250830/20250830112106.jpg" width="1200" height="706" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<h1 id="課題">課題</h1>

<p>自作サービスであるlytnoteはRender.comを利用してデプロイしている。しかし月額料金がかかっているため、これをなくしたい。Fly.ioはレガシーHobyyプランの状態であるため、月の合計金額が$5までなら無料で利用できる。こちらに移行する。</p>

<h1 id="データのバックアップ">データのバックアップ</h1>

<p>Render.comでデプロイしたアプリケーションのデータのバックアップをとる。こちらのQ&amp;Aが参考になった。</p>

<p><a href="https://community.render.com/t/backup-postgresql-database-using-pg-dump/1233">Backup Postgresql database using pg_dump? - Render</a></p>

<blockquote><p>This worked for me.</p>

<pre><code>PGPASSWORD=&lt;YOUR_DB_PASS&gt; pg_dump \
-h postgres.render.com \
 -U &lt;YOUR_DB_USER&gt; \
 --format=custom --no-acl --no-owner \
&lt;YOUR_DB_NAME&gt; &gt; &lt;YOUR_DUMP_NAME&gt;.dump
</code></pre></blockquote>

<p>なるほど。</p>

<p>まずはRender.com にアクセスして、サービスのダッシュボードから「PSQL Command」のコマンドをコピーする。</p>

<p><a href="https://dashboard.render.com/">Render &middot; The Easiest Cloud For All Your Apps</a></p>

<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250723/20250723054737.png" width="1200" height="438" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>ターミナルでこのコマンドを入力すると、Render.comにデプロイしたアプリのサーバーへアクセスすることができる。ここでさきほどの<code>pg_dump</code> コマンドを実行し、データベースのバックアップファイルをローカルにダウンロードする。</p>

<pre class="code" data-lang="" data-unlink>PGPASSWORD=&lt;PASSWORD&gt; pg_dump -h &lt;自分のサーバーのアドレスrender.com&gt; -U &lt;アプリ名&gt; --format=custom --no-acl --no-owner &lt;dbの名前&gt; -f &lt;任意のファイル名.dump&gt;</pre>


<p>これでファイルをダウンロードできた。</p>

<h1 id="データの移行">データの移行</h1>

<h2 id="1-状態の確認">1. 状態の確認</h2>

<p>取り出したバックアップデータを今度はfly.ioへデプロイしたアプリへ投入する。</p>

<p>カレントディレクトリをデプロイしたプロジェクトに移動させてから以下のコマンドを打つ。</p>

<pre class="code" data-lang="" data-unlink>fly status</pre>




<pre class="code" data-lang="" data-unlink> $ fly status
App
  Name     = &lt;app名&gt;                                        
  Owner    = personal                                                        
  Hostname = &lt;app名&gt;.fly.dev                                
  Image    = xxxxxx

Machines
PROCESS ID              VERSION REGION  STATE   ROLE    CHECKS  LAST UPDATED         
app     xxxxx  2       nrt     stopped                 2025-08-30T01:29:09Z
app     yyyyy  2       nrt     stopped                 2025-08-20T19:57:11Z</pre>


<h2 id="2-Machineの起動">2. Machineの起動</h2>

<p>Machinesは停止していた。これを起動させておく必要がある。以下のコマンドを打つ。</p>

<pre class="code" data-lang="" data-unlink>　fly machine start &lt;マシンID&gt; -a &lt;app名&gt;</pre>


<p>マシンIDは複数あるがどれを指定しても良い。</p>

<p>再度  <code>fly status</code> コマンドによってステータスを表示させ、Machineが<code>stopped</code>から<code>started</code>になっていることを確認する。</p>

<pre class="code" data-lang="" data-unlink>Machines
PROCESS ID              VERSION REGION  STATE   ROLE    CHECKS  LAST UPDATED         
app     xxxxx  2       nrt     started                2025-08-30T01:29:09Z
app     yyyyy  2       nrt     stopped                 2025-08-20T19:57:11Z
</pre>


<h2 id="3-環境変数から接続情報を確認">3. 環境変数から接続情報を確認</h2>

<p>Fly.ioが動いているコンテナにログインし、サーバー上に保管されている環境変数を確認する。</p>

<pre class="code" data-lang="" data-unlink>$ fly ssh console -a &lt;app名&gt;

 Connecting to xxxx... complete 

root@xxxx:/rails# echo $DATABASE_URL 

postgres://&lt;ユーザー名&gt;:&lt;DATABASE_PASSWORD&gt;@&lt;ホスト名&gt;:5432/xxxxxx..</pre>


<p>環境変数<code>DATABASE_URL</code>から、<code>DATABASE_PASSWORD</code>　やホスト名などを確認できる。</p>

<h2 id="4-プロキシを張る">4. プロキシを張る</h2>

<p>データベースへバックアップデータを投入するために、ローカルからfly.ioのデータベースへ接続する。そのためには<code>fly proxy</code>　をつかう必要がある。</p>

<p>新しくターミナルウィンドウを開き、以下のコマンドを打つ。</p>

<pre class="code" data-lang="" data-unlink>fly proxy 5433:5432 -a &lt;postgres-app-name&gt;</pre>


<p>このとき、5433はローカル側のport番号の指定。5432をローカルで使用していないなら以下でも問題ない。</p>

<pre class="code" data-lang="" data-unlink>fly proxy 5432 -a &lt;postgres-app-name&gt;</pre>


<p><a href="https://fly.io/docs/postgres/connecting/connecting-with-flyctl/">Connect With flyctl &middot; Fly Docs</a></p>

<p>このターミナルウィンドウはそのままにしておく。</p>

<h2 id="5-データの投入">5. データの投入</h2>

<p>以下のコマンドを打つ。</p>

<pre class="code" data-lang="" data-unlink>PGPASSWORD=＜DATABASE_PASSWORD＞ pg_restore \
  -h localhost  \
  -U ＜ユーザー名＞ \
  -d ＜データベース名＞ \
  ＜ファイル名.dump＞</pre>


<p>ユーザー名とデータベース名は同じだった。fly.ioの&lt;app名>でできた。ファイル名はターミナルでコマンド打った場所からのパスを入力する。私の場合は<code>Desktop/ファイル名.dump</code> だった。</p>

<p>成功するとSQLの実行ログがぶわぁーっと出る。</p>

<h1 id="おわりに">おわりに</h1>

<p>データの移行は初めてだったがなんとかできた。少しずつ個人開発を頑張っていこう。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E6%9F%94%E3%82%89%E3%81%8B%E3%81%AA%E5%A4%95%E7%84%BC%E3%81%91%E3%81%AE%E5%85%89%E3%81%AB%E7%85%A7%E3%82%89%E3%81%95%E3%82%8C%E3%81%9F%E9%9B%84%E5%A4%A7%E3%81%AA%E5%B1%B1%E9%A0%82-Qoe1RbKPzMo?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>課題 自作サービスであるlytnoteはRender.comを利用してデプロイしている。しかし月額料金がかかっているため、これをなくしたい。Fly.ioはレガシーHobyyプランの状態であるため、月の合計金額が$5までなら無料で利用できる。こちらに移行する。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/e0e0151d23b86da44faa00294fba62e2c7c4359b/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250830%2F20250830112106.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>課題 自作サービスであるlytnoteはRender.comを利用してデプロイしている。しかし月額料金がかかっているため、これをなくしたい。Fly.ioはレガシーHobyyプランの状態であるため、月の合計金額が$5までなら無料で利用できる。こちらに移行する。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>課題 自作サービスであるlytnoteはRender.comを利用してデプロイしている。しかし月額料金がかかっているため、これをなくしたい。Fly.ioはレガシーHobyyプランの状態であるため、月の合計金額が$5までなら無料で利用できる。こちらに移行する。</itunes:summary></item><item><title>6年かけてやっと未経験ITエンジニア転職を諦めることができた/オープンセミナー広島 2025</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Tue, 26 Aug 2025 07:00:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398560014104</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250824/20250824163631.jpg" width="1200" height="783" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>文章を書くのが苦手になってしまった。しかし、それは慣れによって解決されるかもしれない。説明したいことが頭の中に入っていても、それらをどうやって一つの道に置いていくかはきっとコツがあるのだろう。短いに越したことはないが、なにも書けないよりはダラダラと連ねた方がいい場合もある。</p>

<p>オープンセミナー2025 @広島というイベントに参加した。長い歴史のあるIT系のイベントで、前から行きたいとは思っていた。長丁場なので、家を空けることに気が引けたのだが、妻が快く了承してくれた。ついでに懇親会も行って良いとのこと。ありがたいことだった。</p>

<p><a href="https://osh.connpass.com/event/355425/">&#x30AA;&#x30FC;&#x30D7;&#x30F3;&#x30BB;&#x30DF;&#x30CA;&#x30FC;2025@&#x5E83;&#x5CF6; &minus; &#x541B;&#x306F;&#x3069;&#x3053;&#x3067;&#x52D5;&#x304B;&#x3059;&#x304B;&#xFF1F; - connpass</a></p>

<p>来場者は六十名ほどで、知らない人がほとんどだった。ナカミチさんの隣が空いていたのでそこに座った。しばらくするとイノウエさんもきた。JBUGのような感じになった。色々話したがあまり思い出せない。</p>

<p>自分もLTで発表した。今回のテーマは「君はどこで動かすか？」というものだが、私はただただ現職で頑張っていくぞということを伝えた。</p>

<p><iframe src="https://www.docswell.com/slide/574LXG/embed" allowfullscreen="true" class="docswell-iframe" width="620" height="466" style="border: 1px solid #ccc; display: block; margin: 0px auto; padding: 0px; aspect-ratio: 620/466;"></iframe><cite class="hatena-citation"><a href="https://www.docswell.com/s/kyokucho1989/574LXG-2025-08-19-054718">www.docswell.com</a></cite></p>

<p>この5、6年ほどキャリアについて悩んでた。どうしてもITエンジニアになりたくて、でも家庭の都合もあってなれなくてずっとモヤモヤしてた。単純に技術力を上げれば克服できるものではないのに、学習することによって現実から逃げていた。</p>

<p>転機などというものはなかった。ジワジワと環境が変わり、いつしか「別にここでも夢を実現できるのでは？？」と考え始めた。結局は今ある手札で戦っていくしかないんだろうなぁ。誰かもそう言っていた。</p>

<p>会場が変わって懇親会となった。各自が飲み物を持ってきていて、食事も豪華だった。たこ焼きを食べそびれたのが悔やまれる。懇親会のときもLTを少しだけした。「これから私はどう動くか」ということだけ話した。自分の興味のあることはいろいろあるけど、業務内でもそれらができるようにやっていくぞ、という決意を述べた。</p>

<p>LTの終了後、オザキさんが「kyokuchoさんは、、すごいですよ」と声をかけてくれたのが嬉しかった。今回のセミナーの実行委員長だったカネヤスさんからも「応援しますよ！！」というエールを頂いた。</p>

<p>帰り道は日が暮れたのにまだジメジメと暑かった。しかし足取りは軽かったし、体の奥から燃えてくるものがあった。呪いというか、縛りがとれた気がする。キルアが自身の頭に刺された針を取り除いた感覚に近い。これからもコードを書くし、作りたいものを作るし、やりたいことをやる。ここで。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E6%9D%BE%E3%81%AE%E6%9C%A8%E3%81%8C%E7%94%9F%E3%81%84%E8%8C%82%E3%82%8B%E9%9B%AA%E3%81%AB%E8%A6%86%E3%82%8F%E3%82%8C%E3%81%9F%E3%82%AE%E3%82%B6%E3%82%AE%E3%82%B6%E3%81%AE%E5%B1%B1%E9%A0%82-b7BrzoxU3ZE?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>文章を書くのが苦手になってしまった。しかし、それは慣れによって解決されるかもしれない。説明したいことが頭の中に入っていても、それらをどうやって一つの道に置いていくかはきっとコツがあるのだろう。短いに越したことはないが、なにも書けないよりはダラダラと連ねた方がいい場合もある。 オープンセミナー2025 @広島というイベントに参加した。長い歴史のあるIT系のイベントで、前から行きたいとは思っていた。長丁場なので、家を空けることに気が引けたのだが、妻が快く了承してくれた。ついでに懇親会も行って良いとのこと。ありがたいことだった。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/14b672f4ec3a353c28bb2ea6cd57e89f6ef92c73/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250824%2F20250824163631.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>文章を書くのが苦手になってしまった。しかし、それは慣れによって解決されるかもしれない。説明したいことが頭の中に入っていても、それらをどうやって一つの道に置いていくかはきっとコツがあるのだろう。短いに越したことはないが、なにも書けないよりはダラダラと連ねた方がいい場合もある。 オープンセミナー2025 @広島というイベントに参加した。長い歴史のあるIT系のイベントで、前から行きたいとは思っていた。長丁場なので、家を空けることに気が引けたのだが、妻が快く了承してくれた。ついでに懇親会も行って良いとのこと。ありがたいことだった。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>文章を書くのが苦手になってしまった。しかし、それは慣れによって解決されるかもしれない。説明したいことが頭の中に入っていても、それらをどうやって一つの道に置いていくかはきっとコツがあるのだろう。短いに越したことはないが、なにも書けないよりはダラダラと連ねた方がいい場合もある。 オープンセミナー2025 @広島というイベントに参加した。長い歴史のあるIT系のイベントで、前から行きたいとは思っていた。長丁場なので、家を空けることに気が引けたのだが、妻が快く了承してくれた。ついでに懇親会も行って良いとのこと。ありがたいことだった。</itunes:summary></item><item><title>RailsアプリをFly.ioへデプロイする際に発生したエラー（MissingKeyError）を解消した話</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Fri, 15 Aug 2025 07:15:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398538276184</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p>記事の執筆を丸ごとAIに任せようとしたが、生成を待つ時間が億劫になってきた。彼には校正や修正など単純な作業をさせるとして、文章そのものは自分で書いた方がいいのかもしれない。</p>

<h1 id="要約">要約</h1>

<p>Rails v6アプリをFly.ioを用いてデプロイを試みた。<code>MissingKeyError</code>が発生したが、Dockerfileを<code>--precompile=defer</code>というオプションをつけて再度生成することによって、無事にデプロイができた。</p>

<h1 id="背景">背景</h1>

<p>前回の続きで、RailsアプリをFly.ioへデプロイすることを試みた。しかし、<code>fly deploy</code>を実行すると以下のようなエラーが発生していた。</p>

<pre class="code" data-lang="" data-unlink>ActiveSupport::EncryptedFile::MissingKeyError: Missing encryption key to decrypt file with. Ask your team for your master key and write it to /rails/config/master.key or put it in the ENV[&#39;RAILS_MASTER_KEY&#39;].</pre>


<p>これを解消することにした。</p>

<h1 id="調査">調査</h1>

<p>このエラー文はなぜ発生するのか調べた。どうもfly deployを行う際にDockerfileで実行する<code>RUN SECRET_KEY_BASE=DUMMY ./bin/rails assets:precompile</code>　部分でエラーが出ているようだ。DUMMYの箇所が気になったので調べた。以下の記事を見つけた。</p>

<p><a href="https://tech.timee.co.jp/entry/2024/02/14/102432">&#x3010;&#x30A4;&#x30D9;&#x30F3;&#x30C8;&#x30EC;&#x30DD;&#x30FC;&#x30C8;&#x3011;Rails&#x30A2;&#x30D7;&#x30EA;&#x3067;&#x79D8;&#x533F;&#x60C5;&#x5831;&#x3092;&#x74B0;&#x5883;&#x5909;&#x6570;&#x304B;&#x3089;Credentials&#x306B;&#x79FB;&#x884C;&#x3057;&#x305F;&#x8A71; - Timee Product Team Blog</a></p>

<blockquote><p>Rails 7.1から SECRET_KEY_BASE_DUMMY が導入されました。これは、SECRET_KEY_BASE の代わりにダミー値を自動的に設定する SECRET_KEY_BASE_DUMMY です。assets:precompile 実行時に SECRET_KEY_BASE が必要ない場合でも、エラーが発生することを防げます。</p></blockquote>

<p>そう。<code>SECRET_KEY_BASE=DUMMY</code> はRails 7.1から使える記法であった。私のアプリはRails6.1だ。このため、SECRET_KEY_BASEがない状態のままプリコンパイルが実行されたためエラーとなっていた。</p>

<h1 id="解決策">解決策</h1>

<p>このエラーの解消方法は公式のドキュメントに記載されていた。
<a href="https://fly.io/docs/rails/getting-started/existing/">Existing Rails Apps &middot; Fly Docs</a></p>

<pre class="code" data-lang="" data-unlink>bin/rails generate dockerfile --precompile=defer</pre>


<p>これはDockerfileを生成する際にprecompileをdefer
これを実行して再度deployするとできた。</p>

<p>Rails 6系ではアセットプリコンパイル時に SECRET_KEY_BASE が必要になる場合がある。これは、プリコンパイル処理の中で暗号化キーを利用してcredentialsやencryptedファイルにアクセスする可能性があるためだ。
今回のように環境変数をデプロイ後に設定できる構成では、ビルド時にプリコンパイルを避ける（defer）方針が有効となる。</p>
]]></content:encoded><description>記事の執筆を丸ごとAIに任せようとしたが、生成を待つ時間が億劫になってきた。彼には校正や修正など単純な作業をさせるとして、文章そのものは自分で書いた方がいいのかもしれない。 要約 Rails v6アプリをFly.ioを用いてデプロイを試みた。MissingKeyErrorが発生したが、Dockerfileを--precompile=deferというオプションをつけて再度生成することによって、無事にデプロイができた。 背景 前回の続きで、RailsアプリをFly.ioへデプロイすることを試みた。しかし、fly deployを実行すると以下のようなエラーが発生していた。 ActiveSupport…</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/747c33924528d337619e17080e3f911839d8f4a7/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250814%2F20250814090915.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>記事の執筆を丸ごとAIに任せようとしたが、生成を待つ時間が億劫になってきた。彼には校正や修正など単純な作業をさせるとして、文章そのものは自分で書いた方がいいのかもしれない。 要約 Rails v6アプリをFly.ioを用いてデプロイを試みた。MissingKeyErrorが発生したが、Dockerfileを--precompile=deferというオプションをつけて再度生成することによって、無事にデプロイができた。 背景 前回の続きで、RailsアプリをFly.ioへデプロイすることを試みた。しかし、fly deployを実行すると以下のようなエラーが発生していた。 ActiveSupport…</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>記事の執筆を丸ごとAIに任せようとしたが、生成を待つ時間が億劫になってきた。彼には校正や修正など単純な作業をさせるとして、文章そのものは自分で書いた方がいいのかもしれない。 要約 Rails v6アプリをFly.ioを用いてデプロイを試みた。MissingKeyErrorが発生したが、Dockerfileを--precompile=deferというオプションをつけて再度生成することによって、無事にデプロイができた。 背景 前回の続きで、RailsアプリをFly.ioへデプロイすることを試みた。しかし、fly deployを実行すると以下のようなエラーが発生していた。 ActiveSupport…</itunes:summary></item><item><title>久しぶりに改修したRailsアプリでnode-sassのビルドエラーを解消した</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Thu, 31 Jul 2025 07:00:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398524923348</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250730/20250730060101.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<h1 id="はじめに">はじめに</h1>

<p>ずっと前に開発したWebサービスがある。lytnoteといって、目標設定機能のついた日報アプリだ。デプロイにrender.comを利用しているが、月に1,000円ほど月額料金がかかっている。サービスを永続的なものにしたいので、運営コストはなるべく安いものにしたい。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Flytnote.com%2F" title="lytnote" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://lytnote.com/">lytnote.com</a></cite></p>

<p>そういうわけでfly.ioへ移行することとした。しかし移行する前にひさしぶりにアプリをローカルで立ち上げようとするもエラーが発生する。どうやらupdateが必要なgemがあったり、依存性の問題があるようだ。</p>

<p>これを解消しよう。</p>

<h1 id="AIと共に生きる">AIと共に生きる</h1>

<p>もうAIと共に生きることにしたのでGithub Copilotの年間プランに入会した。VScodeに彼を入れることで、現在のソースコードを読み取ってくれて、こちらからの質問にもうまく対応してくれる。ChatGPTだと自分がコードを貼り付けて質問する必要があるが、情報量が足りずに齟齬が起きる場合があった。</p>

<h1 id="発生したエラー">発生したエラー</h1>

<p>ターミナルで<code>rails s</code>　と実行するとエラーが発生した。</p>

<pre class="code" data-lang="" data-unlink>/Users/xxx/lytnote/node_modules/node-sass: Command failed.
Exit code: 1
Command: node scripts/build.js
Arguments:
Directory: /Users/kondoukou/lytnote/node_modules/node-sass
Output:
Building: /Users/xxx/.nvm/versions/node/v18.1.0/bin/node /Users/kondoukou/lytnote/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
gyp info it worked if it ends with ok</pre>


<p><code>node-sass</code>と<code>Node.js</code> に問題があるようだ。</p>

<h1 id="node-sassとはなにか">node-sassとはなにか</h1>

<p><a href="https://www.npmjs.com/package/node-sass">node-sass - npm</a></p>

<blockquote><p>Node-sass is a library that provides binding for Node.js to LibSass, the C version of the popular stylesheet preprocessor, Sass.
It allows you to natively compile .scss files to css at incredible speed and automatically via a connect middleware.</p></blockquote>

<p>node-sassとはWebpackerのバージョン4で使用されているライブラリである。SassをCSSに変換する際に使われている。しかし、ライブラリのベースとされているLibSassの開発が停止となり、node-sass自体も現在は非推奨である。そのため、Node.jsのバージョンを上げると不具合が起こる。</p>

<h1 id="WebpackerとRails">WebpackerとRails</h1>

<p>Rails 6では、JavaScriptやCSS、画像などのフロントエンド関係の要素を管理しやすくするため、Webpackerという仕組みが導入されている。WebpackerはJavaScriptモジュールバンドラーであるWebpackのラッパーライブラリである。Railsの皮を着せたwebpackだ。</p>

<p>Rails7以降ではWebpackerは廃止されたため、エラーを回避するためにRails7にアップグレードするという選択肢もあった。しかし、これはこれで変更箇所が多すぎるので今回は見送った。</p>

<h1 id="修正箇所">修正箇所</h1>

<p>バージョンの不整合を避けるため、以下のように修正した。</p>

<p><code>Gemfile</code></p>

<pre class="code" data-lang="" data-unlink>- gem &#39;webpacker&#39;, &#39;~&gt; 4.0&#39;
+ gem &#39;webpacker&#39;, &#39;~&gt; 5.4&#39;, &#39;&gt;= 5.4.4&#39;</pre>


<p><code>package.json</code></p>

<pre class="code" data-lang="" data-unlink>-    &#34;@rails/webpacker&#34;: &#34;4.3.0&#34;,
+   &#34;@rails/webpacker&#34;: &#34;^5.4.4&#34;,</pre>


<p><code>Gemfile</code> と<code>package.json</code> の両方ともバージョンを書き換える。</p>

<p>そうして</p>

<pre class="code" data-lang="" data-unlink>bundle install 
yarn install</pre>


<p>を実行した。無事にエラーは解消された。</p>

<h1 id="おわりに">おわりに</h1>

<p>技術的負債は久々に触ると手間がかかるが、CopilotやChatGPTのようなツールがあると、心理的なハードルがかなり下がる。</p>

<p>また続きを書く。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E9%9D%99%E3%81%8B%E3%81%AA%E6%B9%96%E3%81%AE%E6%B0%B4%E9%9D%A2%E3%81%AB%E5%A4%9C%E7%A9%BA%E3%81%8C%E6%98%A0%E3%82%8B-xS0nUx6rlvE?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@city2forest?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Troy Olson</a></p>
]]></content:encoded><description>はじめに ずっと前に開発したWebサービスがある。lytnoteといって、目標設定機能のついた日報アプリだ。デプロイにrender.comを利用しているが、月に1,000円ほど月額料金がかかっている。サービスを永続的なものにしたいので、運営コストはなるべく安いものにしたい。 lytnote.com そういうわけでfly.ioへ移行することとした。しかし移行する前にひさしぶりにアプリをローカルで立ち上げようとするもエラーが発生する。どうやらupdateが必要なgemがあったり、依存性の問題があるようだ。 これを解消しよう。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/d6dfc4da33627781ba7bfa96ed6bbb4c4b0d3e9d/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250730%2F20250730060101.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>はじめに ずっと前に開発したWebサービスがある。lytnoteといって、目標設定機能のついた日報アプリだ。デプロイにrender.comを利用しているが、月に1,000円ほど月額料金がかかっている。サービスを永続的なものにしたいので、運営コストはなるべく安いものにしたい。 lytnote.com そういうわけでfly.ioへ移行することとした。しかし移行する前にひさしぶりにアプリをローカルで立ち上げようとするもエラーが発生する。どうやらupdateが必要なgemがあったり、依存性の問題があるようだ。 これを解消しよう。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>はじめに ずっと前に開発したWebサービスがある。lytnoteといって、目標設定機能のついた日報アプリだ。デプロイにrender.comを利用しているが、月に1,000円ほど月額料金がかかっている。サービスを永続的なものにしたいので、運営コストはなるべく安いものにしたい。 lytnote.com そういうわけでfly.ioへ移行することとした。しかし移行する前にひさしぶりにアプリをローカルで立ち上げようとするもエラーが発生する。どうやらupdateが必要なgemがあったり、依存性の問題があるようだ。 これを解消しよう。</itunes:summary></item><item><title>Claude Codeで向き合う WATASHI.mdという開発理念</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sat, 19 Jul 2025 18:07:11 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398514462481</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250719/20250719070732.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>最近話題になっているClaude CodeをWEB開発に導入することとした。ClaudeCodeとはターミナル上で動作する、AIコーディング支援ツールである。Cursorとは異なり、CLI上で動くツールだ。対話型でコーディングを進めるため、画面の向こうの別の人物とやりとりしているようだ。</p>

<p>AIの利用についてはいまだに賛否両論があるかもしれない。しかし食わず嫌いになってはいけない。</p>

<h1 id="Claude-Codeの導入">Claude Codeの導入</h1>

<p>さて、まずはinstallしよう。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fdocs.anthropic.com%2Fja%2Fdocs%2Fclaude-code%2Foverview" title="Claude Code概要 - Anthropic" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://docs.anthropic.com/ja/docs/claude-code/overview">docs.anthropic.com</a></cite></p>

<pre class="code" data-lang="" data-unlink>✻ Welcome to Claude Code!                         │
│                                                   │
│   /help for help, /status for your current setup  │
│                                                   │
│   cwd: /Users/(name)/lytcycle                  │
╰───────────────────────────────────────────────────╯

 Tips for getting started:

 1. Run /init to create a CLAUDE.md file with instructions for Claude
 2. Use Claude to help with file analysis, editing, bash commands and git
 3. Be as specific as you would with another engineer for the best results
 4. ✔ Run /terminal-setup to set up terminal integration
</pre>


<p>いったいなにからやればいいんだ。</p>

<h1 id="WATASHImd-をつくる">WATASHI.md をつくる</h1>

<p>Claude Codeは<code>CLAUDE.md</code> というファイルを参照し、開発方針や注意事項を確認しているらしい。マークダウンファイルなので日本語で書ける。設計仕様書のようなものか。</p>

<p>彼を参考にして、わたしも<code>WATASHI.md</code>をつくる（宣言する）ことにしよう。</p>

<pre class="code" data-lang="" data-unlink># 理念
1. 常に考える
2. 考えるとは論じることである
3. 余白は論じることを補完する
4. 良さは結果を超える


# 方針
1. 課題を明らかにする
2. なぜその課題を解決するかを論じる
3. 課題解決の手法として複数の選択肢を挙げ、違いを論じる
4. 手法を選択した理由を論じる
5. 用いた手法によって課題が解決されたかを論じる
6. 第三者が出力したコードを扱うときは十分に理解して使う
7. 「十分に理解」とは、自分の言葉で説明ができるということである
8. 方針はアップデートされる</pre>


<h2 id="理念について">理念について</h2>

<p>理念は私の中の大きな枠組みである。理念に基づき方針が決定された。何事も文章にすることで、理解は進むし、コーディングの腕も上がるはずだ。</p>

<p>思考とは言語。これはウィトゲンシュタインが同様のことを述べている。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fmatoyomi.hatenablog.com%2Fentry%2F20150821%2F1440105614" title="インド象の思考と論理哲学論考 - マトリョーシカ的日常" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://matoyomi.hatenablog.com/entry/20150821/1440105614">matoyomi.hatenablog.com</a></cite></p>

<p>余白と良さについては私の過去の記事を参考にした。常に考えるには、余白というか休息も必要だ。そして最後に決定を下すのは自分の心であり、良さである。これは道徳的観点や単純な趣味嗜好も含まれる。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fmatoyomi.hatenablog.com%2Fentry%2F20160316%2F1458075015" title="余白と良さとフェルマーの最終定理 - マトリョーシカ的日常" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://matoyomi.hatenablog.com/entry/20160316/1458075015">matoyomi.hatenablog.com</a></cite></p>

<h2 id="方針について">方針について</h2>

<p>実際にコードを書く上での方針である。開発とは課題解決である。そのため課題を明らかにし、ほんとうにその課題は解決される必要があるかも考えないといけない。コーディングはそれからの話だ。</p>

<h1 id="方針に基づいた開発">方針に基づいた開発</h1>

<h2 id="課題と選択肢の提示">課題と選択肢の提示</h2>

<p>今回はERBファイルのlintツールを導入することとした。今までもlintは行っていたが、erbファイルは対象にしていなかった。コードの保守性を向上させるため、導入する。</p>

<p>手法はいくつかある。無難にerb-lint gemを導入する。他の選択肢を含めた表を以下にまとめた。</p>

<table>
<thead>
<tr>
<th>ツール名 </th>
<th> 主な用途 </th>
<th> 備考</th>
</tr>
</thead>
<tbody>
<tr>
<td>erb-lint </td>
<td> ERB用の総合的なLinter </td>
<td> 最も一般的</td>
</tr>
<tr>
<td>haml-lint + 変換 </td>
<td> 間接的なチェック </td>
<td> Hamlは使っていないので選択肢から除外</td>
</tr>
<tr>
<td>rubocop + Ruby抽出 </td>
<td> 埋め込みRubyコードのLint </td>
<td> Ruby部分しか使えない</td>
</tr>
<tr>
<td>htmlhint </td>
<td> HTML構文のLint </td>
<td> HTMLしか使えない</td>
</tr>
<tr>
<td>prettier-plugin-erb </td>
<td> フォーマッタ </td>
<td> 整形に特化/ <a href="https://prettier.io/docs/plugins">https://prettier.io/docs/plugins</a></td>
</tr>
</tbody>
</table>


<p>フォーマッタは使えそうだ。また次回にしよう。</p>

<h2 id="実装">実装</h2>

<p>まずは以下のgemをGemfileに記載し、<code>bundle install</code> を行う。</p>

<p><a href="https://github.com/Shopify/erb_lint">GitHub - Shopify/erb_lint: Lint your ERB or HTML files</a></p>

<p><code>Gemfile</code></p>

<pre class="code lang-ruby" data-lang="ruby" data-unlink>group <span class="synConstant">:development</span> <span class="synStatement">do</span>
  <span class="synPreProc">gem</span> <span class="synSpecial">'</span><span class="synConstant">erb_lint</span><span class="synSpecial">'</span>, <span class="synConstant">require</span>: <span class="synConstant">false</span>
<span class="synComment"># 略</span>
<span class="synStatement">end</span>
</pre>


<p>設定ファイルである<code>.erb_lint.yml</code> を作成する。readmeに記載している <code>better_html_config: .better-html.yml</code> は消す。これは別のgemである<code>better_html</code>を用いる設定だ。</p>

<p><code>.erb_lint.yml</code></p>

<pre class="code yml" data-lang="yml" data-unlink>---
EnableDefaultLinters: true
linters:
  ErbSafety:
    enabled: true
   #  better_html_config: .better-html.yml　ここは削除
  Rubocop:
    enabled: true
    rubocop_config:
      inherit_from:
        - .rubocop.yml</pre>


<h2 id="lintから除外するファイルの設定">lintから除外するファイルの設定</h2>

<p><code>$ bundle exec erb_lint --lint-all</code> を実行すると、700件以上の修正箇所が発見された。多すぎると差分がわからなくなるので、いくつかのファイルをerb-lintの対象から除外する。例えば <code>/app/views/simulations/</code> 以下のerbファイルは数が多いので今日はやめる。
様子を見ながら、除外の対象を減らそう。</p>

<pre class="code" data-lang="" data-unlink>---
EnableDefaultLinters: true
exclude:
  - &#39;**/vendor/**/*&#39;
  - &#39;**/node_modules/**/*&#39;
  - &#39;**/app/views/simulations/*&#39;
  - &#39;**/app/views/layouts/*&#39;
  - &#39;**/app/views/devise/*&#39;
  - &#39;**/app/views/terms/show.html.erb&#39;
linters:
  ErbSafety:
    enabled: true

# 略....</pre>


<h2 id="erbタグが消える">erbタグが消える</h2>

<p>lintを実行すると、必要なerbタグ自体がなくなっていた。もう一度ドキュメントを読むと、以下の記述があった。</p>

<blockquote><p>Note: Each ruby statement (between ERB tags &lt;% ... %>) is parsed and analyzed independently of each other. Any rule that requires a broader context can trigger false positives (e.g. Lint/UselessAssignment will complaint for an assignment even if used in a subsequent ERB tag).</p></blockquote>

<p><a href="https://github.com/Shopify/erb_lint?tab=readme-ov-file#rubocop">https://github.com/Shopify/erb_lint?tab=readme-ov-file#rubocop</a></p>

<p><code>&lt;%</code> などは独立したコードとして解析されるようだ。<code>.erb_lint.yml</code>　に除外するルールを追加して対処する。</p>

<pre class="code yml" data-lang="yml" data-unlink>linters:
  ErbSafety:
    enabled: true

  Rubocop:
    enabled: true
    rubocop_config:
      inherit_from:
        - .rubocop.yml
      Layout/InitialIndentation:
        Enabled: false
      Layout/LineLength:
        Enabled: false
      Layout/TrailingEmptyLines:
        Enabled: false
      Layout/TrailingWhitespace:
        Enabled: false
</pre>


<p><code>bundle exec erb_lint --lint-all</code>を実行し、指摘事項を確認したら、<code>bundle exec erb_lint --lint-all -a</code> を実施する。</p>

<p>できた。</p>

<h2 id="Github-Actionsへ適用">Github Actionsへ適用</h2>

<p>erb-lintをGithub Actionsに適用する。リポジトリにpushすると、他のlintやテストと共に実行されるようになる。</p>

<p>.github/workflows/testandlint.yml</p>

<pre class="code" data-lang="" data-unlink>name: &#34;Ruby on Rails CI&#34;
on:
  push:
    branches: [&#34;main&#34;]
  pull_request:
    branches: [&#34;main&#34;]
jobs:
  test:
# 略
      - name: erb lint
        run: bundle exec erb_lint --lint-all</pre>


<p>これでできた。</p>

<h1 id="終わりに">終わりに</h1>

<p>導入するだけしたが、結局今回はClaude Codeを使っていなかった。しかしこの記事でもって、私の開発方針というか理念が定まった。これを軸としてAIと共にコードに向き合うこととする。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E3%83%89%E3%83%A9%E3%83%9E%E3%83%81%E3%83%83%E3%82%AF%E3%81%AA%E7%A9%BA%E3%81%AE%E4%B8%8B%E5%BD%B1%E3%81%8B%E3%82%89%E5%B1%B1%E3%80%85%E3%81%8C%E6%B5%AE%E3%81%8B%E3%81%B3%E4%B8%8A%E3%81%8C%E3%82%8A%E3%81%BE%E3%81%99-ISezKSUL2gk?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@lifeof_peter_?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Peter Thomas</a></p>
]]></content:encoded><description>最近話題になっているClaude CodeをWEB開発に導入することとした。ClaudeCodeとはターミナル上で動作する、AIコーディング支援ツールである。Cursorとは異なり、CLI上で動くツールだ。対話型でコーディングを進めるため、画面の向こうの別の人物とやりとりしているようだ。 AIの利用についてはいまだに賛否両論があるかもしれない。しかし食わず嫌いになってはいけない。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/25fab70fa5db7b163525d80e257c305ec40717d8/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250719%2F20250719070732.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>最近話題になっているClaude CodeをWEB開発に導入することとした。ClaudeCodeとはターミナル上で動作する、AIコーディング支援ツールである。Cursorとは異なり、CLI上で動くツールだ。対話型でコーディングを進めるため、画面の向こうの別の人物とやりとりしているようだ。 AIの利用についてはいまだに賛否両論があるかもしれない。しかし食わず嫌いになってはいけない。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>最近話題になっているClaude CodeをWEB開発に導入することとした。ClaudeCodeとはターミナル上で動作する、AIコーディング支援ツールである。Cursorとは異なり、CLI上で動くツールだ。対話型でコーディングを進めるため、画面の向こうの別の人物とやりとりしているようだ。 AIの利用についてはいまだに賛否両論があるかもしれない。しかし食わず嫌いになってはいけない。</itunes:summary></item><item><title>【書評】AIは熱を持たないから私たちは負けない/ 結局、人生はアウトプットで決まる</title><category>読書</category><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Tue, 15 Jul 2025 06:30:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398510543953</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250715/20250715050645.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　本当に文章が書けなくなってしまった。それもこれもAIのせいである。彼らが出力するセンテンスはそれなりに必要十分なものであり、それを見定めてNO/GOするだけで満足してしまっていたのだ。このブログもAIに読み込ませてやれば、似たような記事をいくらでも公開することができるだろう。</p>

<p>　危機感を抱いた。たしかにこれからはAIを使えば文章作成などあらゆる作業が楽になる。けれども、考えることをやめたくはない。考えることによって、私自身の能力は向上するし、実際そうだ。</p>

<p>　中島聡さんの「結局、人生はアウトプットで決まる」を読んだ。アウトプットを継続的に行うことで自分の価値を高めて、AIに負けないようにしよう。という内容である。ブログの執筆や配信など、最近は自分の考えをアウトプットするのが簡単になった。容易いので、みんなも頑張ろう、と。</p>

<p>　アウトプットの手法はいくつか記述があったが、私に刺さったのは以下の言葉。</p>

<blockquote><p>それは、あなたが「この情報を伝えたい」という「熱」さえ持てば、文章のテクニックうんぬんを抜きにしても十分さまになるということです。</p></blockquote>

<p>　</p>

<p>　熱はたしかに重要だ。私が投稿した記事の中で反響が大きかったのは、自分が好きな気持ちが入っていたり、感情がこもっているものが多い。これとか。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fmatoyomi.hatenablog.com%2Fentry%2F20220822%2F1661111764" title="30代未経験からのエンジニア転職を諦めた話 - マトリョーシカ的日常" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://matoyomi.hatenablog.com/entry/20220822/1661111764">matoyomi.hatenablog.com</a></cite></p>

<p>　はてブをもらいやすい記事はなんとなく把握している。タイトルがノッている記事だ。炎上を狙っているというかそんなではなく、自分の気持ちが文章だけでなく、タイトルにも滲み出ているもの。悔しさとか嬉しさとか悲しさとか。中島さんが語っている「熱」もそれと同じものなのだろう。文章の技術や精度にとらわれていた気がするが、情熱が先にくるのだなと思った。</p>

<p>　自作サービスをリリースし、フィヨルドブートキャンプも卒業した。本来なこの流れでITエンジニアに転職する流れなのだが、それはやめた。今の会社でまだまだやりたいことがあるためだ。やりきったときに世間がどうなっているか分からないが、自分の気持ちに正直に生きる。AIに負けないようにアウトプットは続けていこう。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E9%9C%9C%E3%81%8C%E9%99%8D%E3%82%8A%E3%81%9F%E6%9C%A8%E3%80%85%E3%81%8C%E3%81%93%E3%81%AE%E3%83%A2%E3%83%8E%E3%82%AF%E3%83%AD%E3%81%AE%E9%A2%A8%E6%99%AF%E3%81%AE%E4%B8%AD%E3%81%A7%E9%9A%9B%E7%AB%8B%E3%81%A3%E3%81%A6%E3%81%84%E3%81%BE%E3%81%99-0emNoLll8WM?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@wolfgang_hasselmann?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Wolfgang Hasselmann</a></p>

<p><div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B07T4G7ZGK?tag=seekseek0011-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="sponsored noopener"><img src="https://m.media-amazon.com/images/I/51S5NbmUhdL._SL500_.jpg" class="hatena-asin-detail-image" alt="結局、人生はアウトプットで決まる　自分の価値を最大化する武器としての勉強術" title="結局、人生はアウトプットで決まる　自分の価値を最大化する武器としての勉強術"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B07T4G7ZGK?tag=seekseek0011-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" target="_blank" rel="sponsored noopener">結局、人生はアウトプットで決まる　自分の価値を最大化する武器としての勉強術</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/%C3%E6%C5%E7%20%C1%EF" class="keyword">中島 聡</a></li><li>実務教育出版</li></ul><a href="https://www.amazon.co.jp/dp/B07T4G7ZGK?tag=seekseek0011-22&amp;linkCode=ogi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="sponsored noopener">Amazon</a></div></div></p>
]]></content:encoded><description>本当に文章が書けなくなってしまった。それもこれもAIのせいである。彼らが出力するセンテンスはそれなりに必要十分なものであり、それを見定めてNO/GOするだけで満足してしまっていたのだ。このブログもAIに読み込ませてやれば、似たような記事をいくらでも公開することができるだろう。 危機感を抱いた。たしかにこれからはAIを使えば文章作成などあらゆる作業が楽になる。けれども、考えることをやめたくはない。考えることによって、私自身の能力は向上するし、実際そうだ。 中島聡さんの「結局、人生はアウトプットで決まる」を読んだ。アウトプットを継続的に行うことで自分の価値を高めて、AIに負けないようにしよう。とい…</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/8febc6408007dbb7d32ecc0baa80e9e3c621a002/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250715%2F20250715050645.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>本当に文章が書けなくなってしまった。それもこれもAIのせいである。彼らが出力するセンテンスはそれなりに必要十分なものであり、それを見定めてNO/GOするだけで満足してしまっていたのだ。このブログもAIに読み込ませてやれば、似たような記事をいくらでも公開することができるだろう。 危機感を抱いた。たしかにこれからはAIを使えば文章作成などあらゆる作業が楽になる。けれども、考えることをやめたくはない。考えることによって、私自身の能力は向上するし、実際そうだ。 中島聡さんの「結局、人生はアウトプットで決まる」を読んだ。アウトプットを継続的に行うことで自分の価値を高めて、AIに負けないようにしよう。とい…</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>本当に文章が書けなくなってしまった。それもこれもAIのせいである。彼らが出力するセンテンスはそれなりに必要十分なものであり、それを見定めてNO/GOするだけで満足してしまっていたのだ。このブログもAIに読み込ませてやれば、似たような記事をいくらでも公開することができるだろう。 危機感を抱いた。たしかにこれからはAIを使えば文章作成などあらゆる作業が楽になる。けれども、考えることをやめたくはない。考えることによって、私自身の能力は向上するし、実際そうだ。 中島聡さんの「結局、人生はアウトプットで決まる」を読んだ。アウトプットを継続的に行うことで自分の価値を高めて、AIに負けないようにしよう。とい…</itunes:summary><itunes:keywords>読書</itunes:keywords></item><item><title>202506の近況</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Mon, 30 Jun 2025 07:00:45 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398494078763</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250630/20250630062440.jpg" width="1200" height="750" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　梅雨は思ったよりも早く終わることになった。隣の家のアジサイが、中途半端な加減で枯れていく。雨が多いのは嫌いだけど、ないならないで寂しい気持ちもある。</p>

<p>　今月はなにも記事を書いていなかったので、六月の最終日にこうして文章をまとめている。いろいろあったはずだけど、何も覚えていない。</p>

<p>　FBCの課題を進めていた。自作サービスはデザインレビューが終了し、残りはコードレビューだけになった。しかし、指摘事項が多く、まだまだ完成しそうにない。</p>

<p>JacaScriptのファイルをいくつか書いているが、それぞれが互いに参照し合う状態になっていて、あまりよろしくない。依存関係を整えてあげる必要があった。ただ、それをしようにも互いの関数を参照しあっているので、うまく分割してあげないといけない。</p>

<p>ジークアクスは終わってしまった。よく分からない場所が多かったのは、きっとよく分からないということなんだろう。もっと他の作品を観て予習しておけばよかった。そういう理由で、ファーストを観終わり、いまはZガンダムを観ている。OP曲が素晴らしかった。</p>

<p>来月はもう少しアウトプットを多くしよう。言いたいことがたくさんあるはずだけれど、そのままになっている。</p>
]]></content:encoded><description>梅雨は思ったよりも早く終わることになった。隣の家のアジサイが、中途半端な加減で枯れていく。雨が多いのは嫌いだけど、ないならないで寂しい気持ちもある。 今月はなにも記事を書いていなかったので、六月の最終日にこうして文章をまとめている。いろいろあったはずだけど、何も覚えていない。 FBCの課題を進めていた。自作サービスはデザインレビューが終了し、残りはコードレビューだけになった。しかし、指摘事項が多く、まだまだ完成しそうにない。 JacaScriptのファイルをいくつか書いているが、それぞれが互いに参照し合う状態になっていて、あまりよろしくない。依存関係を整えてあげる必要があった。ただ、それをしよ…</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/b65e5cac96e3b5fb9319a463d7036917753b7c5c/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250630%2F20250630062440.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>梅雨は思ったよりも早く終わることになった。隣の家のアジサイが、中途半端な加減で枯れていく。雨が多いのは嫌いだけど、ないならないで寂しい気持ちもある。 今月はなにも記事を書いていなかったので、六月の最終日にこうして文章をまとめている。いろいろあったはずだけど、何も覚えていない。 FBCの課題を進めていた。自作サービスはデザインレビューが終了し、残りはコードレビューだけになった。しかし、指摘事項が多く、まだまだ完成しそうにない。 JacaScriptのファイルをいくつか書いているが、それぞれが互いに参照し合う状態になっていて、あまりよろしくない。依存関係を整えてあげる必要があった。ただ、それをしよ…</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>梅雨は思ったよりも早く終わることになった。隣の家のアジサイが、中途半端な加減で枯れていく。雨が多いのは嫌いだけど、ないならないで寂しい気持ちもある。 今月はなにも記事を書いていなかったので、六月の最終日にこうして文章をまとめている。いろいろあったはずだけど、何も覚えていない。 FBCの課題を進めていた。自作サービスはデザインレビューが終了し、残りはコードレビューだけになった。しかし、指摘事項が多く、まだまだ完成しそうにない。 JacaScriptのファイルをいくつか書いているが、それぞれが互いに参照し合う状態になっていて、あまりよろしくない。依存関係を整えてあげる必要があった。ただ、それをしよ…</itunes:summary></item><item><title>有機と量子とフィヨルドブートキャンプ</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sun, 25 May 2025 06:21:51 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398443792603</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250525/20250525055535.jpg" width="1200" height="773" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　日々の文章のよりを貯めすぎるのも考えものだ。どうでも良いことはどうでも良い時に書いておかないと、忘れてしまうし、風味が逃げてしまう気もする。AIが登場し、それらで文章を出力する機会が増えてから、町中に散らばっている言葉たちは「あれは人間が考えたセンテンスではないのでは」と身構えるようになった。正しい日本語、整った日本語、と言っていた時代が懐かしく思える。</p>

<p>　久しぶりにWiredという雑誌を読んだ。宇多田ヒカルが表紙だった。量子コンピュータについて書かれていた。あまり意味がわからなかったけれど、自然界が量子力学で動いているというのはしっくりきた。</p>

<blockquote><p>自然界は量子力学の法則で動いている。例えば、なぜ水は0度で凍り、100度で沸騰するのか。これらは水分子中の電子の振る舞いという量子力学的な効果から説明され、残念ながら0と1の掛け算と足し算という法則では動いてない。</p></blockquote>

<p><a href="https://wired.jp/branded/2025/02/03/ipa-2/">&ldquo;&#x4E16;&#x754C;&#x306E;&#x7BB1;&#x5EAD;&rdquo;&#x305F;&#x308B;&#x91CF;&#x5B50;&#x30B3;&#x30F3;&#x30D4;&#x30E5;&#x30FC;&#x30C6;&#x30A3;&#x30F3;&#x30B0;&#x306F;&#x3001;&#x4F55;&#x3092;&#x5909;&#x3048;&#x308B;&#x306E;&#x304B; | WIRED.jp</a></p>

<p>　現実世界が処理落ちしない理由を考えたことがある。量子力学で実装されているなら、処理落ちしないのかもしれない。計算量うんぬんではなく、計算・表現の仕方がいままでのコンピューターと違うのだろう。</p>

<p>　そうなってくるとAI、情報工学のつぎは有機化学が主流になりそうだ。AIによって計算するパワーは増えた。量子コンピュータがもっと量産されたら、必要な計算量自体がぐっと減る。そして、情報工学を自然界にうまいことドッキングさせるのが流行ってくるだろう。あと二十年後にはAIは死語になっているかもしれない。</p>

<p>　フィヨルドブートキャンプの課題を進めていた。やっと自作サービスがひととおり完成した。コードレビューの依頼を行った。これで指摘された事柄を修正し、リリースブログの下書きを書けば卒業できる。長い長い戦いだ。</p>

<p>　しかし卒業しても、なにも変わらないかもしれない。今まで通りの生活を送るだけかもしれない。それはそれ。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E7%85%99%E3%81%8C%E3%81%9F%E3%81%8F%E3%81%95%E3%82%93%E5%87%BA%E3%81%A6%E3%81%84%E3%82%8B%E8%A1%97-AFa3-EuhxOI?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@betagamma?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Daniil Silantev</a></p>

<p><div class="hatena-asin-detail"><a href="https://www.amazon.co.jp/dp/B0F1XG8V8W?tag=seekseek0011-22&amp;linkCode=osi&amp;th=1&amp;psc=1" class="hatena-asin-detail-image-link" target="_blank" rel="sponsored noopener"><img src="https://m.media-amazon.com/images/I/41J3zk6ekVL._SL500_.jpg" class="hatena-asin-detail-image" alt="WIRED（ワイアード）VOL.56" title="WIRED（ワイアード）VOL.56"></a><div class="hatena-asin-detail-info"><p class="hatena-asin-detail-title"><a href="https://www.amazon.co.jp/dp/B0F1XG8V8W?tag=seekseek0011-22&amp;linkCode=osi&amp;th=1&amp;psc=1" target="_blank" rel="sponsored noopener">WIRED（ワイアード）VOL.56</a></p><ul class="hatena-asin-detail-meta"><li><span class="hatena-asin-detail-label">作者:</span><a href="https://d.hatena.ne.jp/keyword/Cond%8F%AB%B1%20Nast%20Japan%20%28%A5%B3%A5%F3%A5%C7%A5%CA%A5%B9%A5%C8%A1%A6%A5%B8%A5%E3%A5%D1%A5%F3%29" class="keyword">Condé Nast Japan (コンデナスト・ジャパン)</a></li><li>コンデナスト・ジャパン</li></ul><a href="https://www.amazon.co.jp/dp/B0F1XG8V8W?tag=seekseek0011-22&amp;linkCode=osi&amp;th=1&amp;psc=1" class="asin-detail-buy" target="_blank" rel="sponsored noopener">Amazon</a></div></div></p>
]]></content:encoded><description>日々の文章のよりを貯めすぎるのも考えものだ。どうでも良いことはどうでも良い時に書いておかないと、忘れてしまうし、風味が逃げてしまう気もする。AIが登場し、それらで文章を出力する機会が増えてから、町中に散らばっている言葉たちは「あれは人間が考えたセンテンスではないのでは」と身構えるようになった。正しい日本語、整った日本語、と言っていた時代が懐かしく思える。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/7a7a3d92f702462e1e9eba22c46f5094e1da3ded/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250525%2F20250525055535.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>日々の文章のよりを貯めすぎるのも考えものだ。どうでも良いことはどうでも良い時に書いておかないと、忘れてしまうし、風味が逃げてしまう気もする。AIが登場し、それらで文章を出力する機会が増えてから、町中に散らばっている言葉たちは「あれは人間が考えたセンテンスではないのでは」と身構えるようになった。正しい日本語、整った日本語、と言っていた時代が懐かしく思える。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>日々の文章のよりを貯めすぎるのも考えものだ。どうでも良いことはどうでも良い時に書いておかないと、忘れてしまうし、風味が逃げてしまう気もする。AIが登場し、それらで文章を出力する機会が増えてから、町中に散らばっている言葉たちは「あれは人間が考えたセンテンスではないのでは」と身構えるようになった。正しい日本語、整った日本語、と言っていた時代が懐かしく思える。</itunes:summary></item><item><title>36歳になった</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sun, 11 May 2025 04:19:50 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398420522919</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250511/20250511041830.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>子供が今日の宿題として国語の文章の音読を始めた。「ケルルンクック」という単語が出てきて、私は自身の過去を思い出した。担任の先生は若いお兄さんで、「ケルルンクック」とはどう言えばいいのかなどと授業でとりあげていた。私が「ケルルン→クック↑！！」と威勢よく言うと、クラスメイトたちは笑っていた。バカにされた気がして、自分で言っておきながら私は泣いた。どうでも良い記憶。</p>

<p>若いお兄さんは当時29歳だったはずだ。</p>

<p>私は今日36歳になった。</p>

<p>　36歳になっていた。なんの感慨もない。去年はずっとコードを書いていた。フィヨルドブートキャンプのカリキュラムのうち、チーム開発を修了した。思ったよりずっと長かった。コードを書くよりも読む方が時間がかかり、そしてレビューを待つことや他のIssueによって問題が解決されるのを待つ時間はそれよりずっと長かった。そのようなものだ。</p>

<p>　自作サービスはやっとデザインレビューを依頼できた。それによって指摘された箇所のデザインをいまは修正している。これが終わればコードをレビューを依頼して、それで修了。リリースブログを書けば卒業できる。</p>

<p>　去年はその合間に資格試験を受けて、合格した。IPAのプロジェクトマネージャ試験。もう何も覚えていないレベルなので、合格体験記など書けるわけがない。この資格を取ったことのメリットは今のところない。資格手当が増えるわけでもなく、いまの業務で適用できる知識はない。でも勉強自体は面白い。資格はまた落ち着いたらなにかとりたい。数学検定とか。</p>

<p>　子供は大変。長男は小学四年生になった。立派に成長したけどそれは体だけで、まだまだ幼い。昆虫、城と興味の対象が移り変わり、こんどは釣りときている。ダイソーのサイトを開いて「これとこれを買って」と呟いている。将来は小学校の先生になりたいのだとか。まじか。</p>

<p>　次男はもっと大変。四月から支援学校に入学し、なんとか頑張っている。今月に入ってから五月病になったのか、ちょっと荒れている。疲れもあるのだと思うし、座学は退屈なのだろう。年末年始に風邪をひいてから腎炎もどきにかかり、運動が制限されている。尿検査の値が正常になるまで、トランポリンも満足にできない。ベッドのマットレスでめっちゃ飛んでるけど。それでもトイレで用を足せる回数が増えてきたし、フォークやスプーンも使えるようになった。成長している。</p>

<p>　妻は毎日忙しそうにしている。次男をバス停まで送ったり、病院へ通院させたり、役所に行って手続きをやったりしている。お疲れ様です。去年から推し活が再開され、ガンダムSEEDやコナンを観ている。楽しいらしい。それは良いことだ。</p>

<p>　この一年はどんな歳になるか。わからない。わからないまま過ぎていくのだろう。まだまだコードを書いていたい。これが仕事になればいいのになあ。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E9%BB%84%E9%87%91%E3%81%AE%E6%97%A5%E3%81%AE%E5%87%BA%E3%81%8C%E9%9C%A7%E3%81%AE%E3%81%8B%E3%81%8B%E3%81%A3%E3%81%9F%E5%B1%B1%E3%81%AE%E9%A2%A8%E6%99%AF%E3%82%92%E7%85%A7%E3%82%89%E3%81%97%E3%81%BE%E3%81%99-MaeshPdBGV4?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@zetong?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Zetong Li</a></p>
]]></content:encoded><description>子供が今日の宿題として国語の文章の音読を始めた。「ケルルンクック」という単語が出てきて、私は自身の過去を思い出した。担任の先生は若いお兄さんで、「ケルルンクック」とはどう言えばいいのかなどと授業でとりあげていた。私が「ケルルン→クック↑！！」と威勢よく言うと、クラスメイトたちは笑っていた。バカにされた気がして、自分で言っておきながら私は泣いた。どうでも良い記憶。 若いお兄さんは当時29歳だったはずだ。 私は今日36歳になった。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/0cc8202539836445167d0ac4d52a69368c896b5a/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250510%2F20250510123233.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>子供が今日の宿題として国語の文章の音読を始めた。「ケルルンクック」という単語が出てきて、私は自身の過去を思い出した。担任の先生は若いお兄さんで、「ケルルンクック」とはどう言えばいいのかなどと授業でとりあげていた。私が「ケルルン→クック↑！！」と威勢よく言うと、クラスメイトたちは笑っていた。バカにされた気がして、自分で言っておきながら私は泣いた。どうでも良い記憶。 若いお兄さんは当時29歳だったはずだ。 私は今日36歳になった。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>子供が今日の宿題として国語の文章の音読を始めた。「ケルルンクック」という単語が出てきて、私は自身の過去を思い出した。担任の先生は若いお兄さんで、「ケルルンクック」とはどう言えばいいのかなどと授業でとりあげていた。私が「ケルルン→クック↑！！」と威勢よく言うと、クラスメイトたちは笑っていた。バカにされた気がして、自分で言っておきながら私は泣いた。どうでも良い記憶。 若いお兄さんは当時29歳だったはずだ。 私は今日36歳になった。</itunes:summary></item><item><title>4月はこうしてつくられる</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Fri, 18 Apr 2025 03:43:11 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398350066156</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250418/20250418034246.jpg" width="1200" height="795" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　長い長い春休みは先週終わった。次男はいままでより二回りほど大きい鞄を背負い支援学校へ通うようになった。なにも話さないためそこの様子は連絡帳でしか把握することができないが、割と元気にやっているらしい。放課後デイも週一で利用するようにしたが、そこでも楽しくやっている。「これなら私もバイトできるかな」と妻。それがいいかもしれない。</p>

<p>　仕事の強度が少しずつ弱まっていき、本当に暇になってきた。いよいよやることがない。しかしこうして暇をしていると、よその部署に異動になるかもしれないので、定期的にやることを生み出さないといけない。ここでの生活は面白いものだ。どこかで書いたかもしれないが、日々の業務は具現化そのものだ。自分が思い描いた装置やラインを図面に起こし、製作する。理想と実際ではかならずギャップが生じるが、そのギャップをなるべく少なくする。ものづくりとかいう作業はこうして行われる。</p>

<p>　コードをいまだに書いている。作成途中のウェブアプリケーションもようやく終わりが見えてきた。細かいデザインをいれていき、そこで一旦終わり。レビューをいただきながら並行してテストを書いたりしていこう。</p>

<p>　そろそろ紙の文字を読まないといけない。久々にWIREDという雑誌でも買おうか。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E3%82%AE%E3%82%B6%E3%81%AE%E3%83%94%E3%83%A9%E3%83%9F%E3%83%83%E3%83%89%E3%81%A8%E3%82%B9%E3%83%95%E3%82%A3%E3%83%B3%E3%82%AF%E3%82%B9%E3%81%8C%E8%A6%8B%E3%81%88%E3%81%BE%E3%81%99-oYDaLFB1qwU?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@jeancarloemer?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Jean Carlo Emer</a></p>
]]></content:encoded><description>長い長い春休みは先週終わった。次男はいままでより二回りほど大きい鞄を背負い支援学校へ通うようになった。なにも話さないためそこの様子は連絡帳でしか把握することができないが、割と元気にやっているらしい。放課後デイも週一で利用するようにしたが、そこでも楽しくやっている。「これなら私もバイトできるかな」と妻。それがいいかもしれない。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/3c09076b716a2cfead27e4322e326843612d99fa/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250418%2F20250418034246.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>長い長い春休みは先週終わった。次男はいままでより二回りほど大きい鞄を背負い支援学校へ通うようになった。なにも話さないためそこの様子は連絡帳でしか把握することができないが、割と元気にやっているらしい。放課後デイも週一で利用するようにしたが、そこでも楽しくやっている。「これなら私もバイトできるかな」と妻。それがいいかもしれない。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>長い長い春休みは先週終わった。次男はいままでより二回りほど大きい鞄を背負い支援学校へ通うようになった。なにも話さないためそこの様子は連絡帳でしか把握することができないが、割と元気にやっているらしい。放課後デイも週一で利用するようにしたが、そこでも楽しくやっている。「これなら私もバイトできるかな」と妻。それがいいかもしれない。</itunes:summary></item><item><title>3月の近況</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sun, 23 Mar 2025 04:26:32 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398338643642</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250323/20250323042554.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　次男が卒園した。短い式だった。彼が通っていた療育園では二十数名の園児たちが式に参加し、それは自由に証書を受け取っていた。皆で歌を歌っている間、次男は終始体を前後左右に振っていた。</p>

<p>　帰りの車内で、もうあの園に行くことはないのだよと伝えると、急に泣き出した。私は話がわかったのか、と驚いたが何のことはなく、空腹になっただけだった。昼食を食べると元に戻った。それでも卒園時の歌をうたおうとすると、自分の頭を叩き出したため、なにか悲しいことは理解しているようだった。そのようなものだ。</p>

<p>　長男は小学校の先生になりたいらしい。数年前は虫博士で、この前までは歴史学者だった。小学校の教員免許は取得できる場所が限られている。少しずつ将来の幅が狭まっているというか確定していくというか、彼もひとりの人間になっている。私の預かり知らぬところで。</p>

<p>　この間学校の工作物を持ち帰ってきて、私に自慢してきた。豆電球を使った懐中電灯らしいが、なんとスイッチがついている。板バネのような厚紙を押すと、電球が付くのだ。厚紙の両端にプラスとマイナス極の電線が取り付けられ、それぞれがアルミホイルで巻かれている。なるほど。学校では習わず、この機構は独自に考えたものらしい。</p>

<p>　彼は先生というより研究者向きだよね、でもドクターまで行かせると学費がかかるしなあ、などと妻と話した。次男は寝て、長男は団体の宿泊研修に向かったためその日は静かな夜だった。ここまでゆっくり会話できるのは珍しい。</p>

<p>　仕事はよく分かんないけどなんか分かってきた。役職もあと一つ上がったら、それで定年まで終わるのかもしれない。でもそれは嫌だなあと思っていた。もう少し偉くなりたい。偉くなると自由にできる。もっと自由に好き勝手やって生きていきたい。</p>

<p>　脈絡のない文章だ。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E9%81%A0%E3%81%8F%E3%81%AB%E5%B1%B1%E3%80%85%E3%81%8C%E5%BA%83%E3%81%8C%E3%82%8B%E7%A0%82%E6%BC%A0%E3%81%AE%E9%A2%A8%E6%99%AF-MUoP6i9w870?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@steve_g_?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Steve Gribble</a></p>
]]></content:encoded><description>次男が卒園した。短い式だった。彼が通っていた療育園では二十数名の園児たちが式に参加し、それは自由に証書を受け取っていた。皆で歌を歌っている間、次男は終始体を前後左右に振っていた。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/0a0836457c88f7e94c0a006837e026d0f142d3c0/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250323%2F20250323042554.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>次男が卒園した。短い式だった。彼が通っていた療育園では二十数名の園児たちが式に参加し、それは自由に証書を受け取っていた。皆で歌を歌っている間、次男は終始体を前後左右に振っていた。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>次男が卒園した。短い式だった。彼が通っていた療育園では二十数名の園児たちが式に参加し、それは自由に証書を受け取っていた。皆で歌を歌っている間、次男は終始体を前後左右に振っていた。</itunes:summary></item><item><title>JBUG広島#15 とドキュメント</title><category>JBUG</category><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sun, 16 Feb 2025 06:21:11 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398329161264</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250216/20250216062040.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　思い出したように本棚から文庫本を出してきてはすきまの時間を見つけて読んでいた。しかしそれも長くは続かない。好奇心というか物事に対する興味が薄れいているような気がする。なにかが蓋をしているという言い方もある。結局はいま作成中のWebサービスを作りきらないと前に進めない。そういうことなのか。</p>

<p>　Backlogのユーザーコミュニティの勉強会に参加した。今回のテーマはドキュメント。どの業界でも職種でも、ドキュメントには向き合う必要があるようだ。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fjbug.connpass.com%2Fevent%2F342193%2F" title="jbug広島#15 「ド。」～文書の運用について～ (2025/02/15 14:00〜)" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://jbug.connpass.com/event/342193/">jbug.connpass.com</a></cite></p>

<p><iframe id="talk_frame_1325691" class="speakerdeck-iframe" src="//speakerdeck.com/player/1c128bdcf32f4514a2ade54188ae1f68" width="710" height="399" style="aspect-ratio:710/399; border:0; padding:0; margin:0; background:transparent;" frameborder="0" allowtransparency="true" allowfullscreen="allowfullscreen"></iframe> <cite class="hatena-citation"><a href="https://speakerdeck.com/yasuoyasuo/15jbugguang-dao-number-15fa-biao-zi-liao">speakerdeck.com</a></cite></p>

<p>　中野さんの発表。良かった。構造化とは伝えたい項目をもれなくダブりなくまとめることである。「網羅的かつ誤解なき言語化」という言い方がしっくりきた。しかし、単純にそれだけではない。ドキュメントは問題解決のために作るもの。「誰に何を伝え、最後にどうなれば良いのか」を見据えて書くのだと。問題が解決できるのであれば枠組みからはずれても構わない。なるほど。</p>

<p>　AIが台頭する昨今、ドキュメントを書く意味を考え直さないといけない。彼らもドキュメントを作成してくれるのだが、こちら側の指示も大事だ。答えだけを尋ねるのではなく、答えにたどりつくために必要そうな項目を考え、それらを適切な粒度・順序でまとめてから指示を出す。そうすると良い。</p>

<p>そうか。</p>

<p><iframe src="https://www.docswell.com/slide/ZJ46M4/embed" allowfullscreen="true" class="docswell-iframe" width="620" height="466" style="border: 1px solid #ccc; display: block; margin: 0px auto; padding: 0px; aspect-ratio: 620/466;"></iframe><cite class="hatena-citation"><a href="https://www.docswell.com/s/kyokucho1989/ZJ46M4-2025-02-13-193547">www.docswell.com</a></cite></p>

<p>　私も少しだけ話をした。ドキュメントはあまり整備されず使われることはないが、それでも現場の声を聞けば少しは良いものにはなるだろうということ。「じゃあどうやってやるか」を考えていたけど、今回の勉強会でなんとなく見えてきた。Backlogのドキュメント機能を使ったらいいのではないか。</p>

<p>　Backlogの新機能である「ドキュメント」はWikiとは異なり、リッチテキストをそのまま使うことができる。非IT系の人間にとってMarkdown記法は馴染みがないからやりやすそうだ。変更管理、差分管理もできるようだ。単純なエクセルだと「誰がなにをいつ変えたか」がわからない。これはできる。良い。</p>

<p>　あとは機械設計書、ライン設計書をドキュメントでつくるのも良い。図面管理とはまた別の考えだ。その仕様にいたった経緯が後任にも伝わりやすい。別途で「過去の不具合リスト」をつくっておき、それを参照させるというやり方もできそうだ。</p>

<p>　Backlogはプロジェクト管理のツールという認識だったが、ドキュメントの運用・管理のツールとしても使えそうだ。ちょっと社内で使えるように調整しないといけない。</p>

<p>　所用で帰ることになってしまい残念だった。次は最後まで参加したい。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E5%A4%9C%E7%A9%BA%E3%81%AB%E6%B5%AE%E3%81%8B%E3%81%B6%E4%B9%B3%E7%99%BD%E8%89%B2%E3%81%AE%E3%83%AD%E3%83%B3%E3%82%B0%E9%9C%B2%E5%87%BA%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88-NPGj5EVCy3o?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@benaja_photos?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Benaja Germann</a></p>
]]></content:encoded><description>思い出したように本棚から文庫本を出してきてはすきまの時間を見つけて読んでいた。しかしそれも長くは続かない。好奇心というか物事に対する興味が薄れいているような気がする。なにかが蓋をしているという言い方もある。結局はいま作成中のWebサービスを作りきらないと前に進めない。そういうことなのか。 Backlogのユーザーコミュニティの勉強会に参加した。今回のテーマはドキュメント。どの業界でも職種でも、ドキュメントには向き合う必要があるようだ。 jbug.connpass.com</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/5648684a55dc15db90bd11ae9a4ae220183641db/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250216%2F20250216062040.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>思い出したように本棚から文庫本を出してきてはすきまの時間を見つけて読んでいた。しかしそれも長くは続かない。好奇心というか物事に対する興味が薄れいているような気がする。なにかが蓋をしているという言い方もある。結局はいま作成中のWebサービスを作りきらないと前に進めない。そういうことなのか。 Backlogのユーザーコミュニティの勉強会に参加した。今回のテーマはドキュメント。どの業界でも職種でも、ドキュメントには向き合う必要があるようだ。 jbug.connpass.com</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>思い出したように本棚から文庫本を出してきてはすきまの時間を見つけて読んでいた。しかしそれも長くは続かない。好奇心というか物事に対する興味が薄れいているような気がする。なにかが蓋をしているという言い方もある。結局はいま作成中のWebサービスを作りきらないと前に進めない。そういうことなのか。 Backlogのユーザーコミュニティの勉強会に参加した。今回のテーマはドキュメント。どの業界でも職種でも、ドキュメントには向き合う必要があるようだ。 jbug.connpass.com</itunes:summary><itunes:keywords>JBUG</itunes:keywords></item><item><title>ただの近況</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Mon, 20 Jan 2025 07:17:24 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398321264130</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20250119/20250119194320.jpg" width="1200" height="800" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　我が家が増えすぎた家財を空き部屋に移すようになって、既に半世紀が過ぎていた。分解されたボールプールは第二の遊び場となり、子供らはそこで球を投げ、おやつを食べ散らかし、（叱られて）死んでいった。</p>

<p> どうでもいいことだった。</p>

<p>　気がついたら年が明けていた。時代に取り残されている。私は相変わらずコードを書いている。グラフとして描かれているノードとリンクが、異常なものかを検出するメソッドを考えていた。結局それは深さ優先探索と呼ばれるアルゴリズムを使うことで実装できた。</p>

<p> 新しいガンダムの映画を観た。話は良くわからなかったけど、絵はきれいだった。音楽も良い。ここからまたアニメが始まるようなので、それも観ていきたい。</p>

<p>来月久しぶりに勉強会に参加する。</p>

<p><a href="https://jbug.connpass.com/event/342193/">https://jbug.connpass.com/event/342193/</a></p>

<p>家族の体調が皆良いことを祈るばかり。だいたい誰かの調子が悪くなるので。</p>

<p>今回はどんなことを話そうか考えよう。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E6%9B%87%E3%82%8A%E7%A9%BA%E3%81%AE%E4%B8%8B%E9%9B%B2%E3%81%A8%E9%9C%A7%E3%81%AB%E8%A6%86%E3%82%8F%E3%82%8C%E3%81%9F%E5%B1%B1-V0QnzTOWU8M?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@androwv?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Andrei R. Popescu</a></p>
]]></content:encoded><description>我が家が増えすぎた家財を空き部屋に移すようになって、既に半世紀が過ぎていた。分解されたボールプールは第二の遊び場となり、子供らはそこで球を投げ、おやつを食べ散らかし、（叱られて）死んでいった。 どうでもいいことだった。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/7803cc2dc97f9363d791e8135a25d41c67590f88/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20250119%2F20250119194320.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>我が家が増えすぎた家財を空き部屋に移すようになって、既に半世紀が過ぎていた。分解されたボールプールは第二の遊び場となり、子供らはそこで球を投げ、おやつを食べ散らかし、（叱られて）死んでいった。 どうでもいいことだった。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>我が家が増えすぎた家財を空き部屋に移すようになって、既に半世紀が過ぎていた。分解されたボールプールは第二の遊び場となり、子供らはそこで球を投げ、おやつを食べ散らかし、（叱られて）死んでいった。 どうでもいいことだった。</itunes:summary></item><item><title>2024の剰余</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Mon, 30 Dec 2024 15:55:34 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398315908909</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20241230/20241230155214.jpg" width="1200" height="869" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>午後十時。抗生剤入りのジュースを次男は疑り深そうに眺めていた。しばらくして、ストローの先をそれにつけてぺろぺろ舐める様を、私たちは笑いを堪えながら見守っていた。それだけの年末である。</p>

<p>長男だけさきに妻の実家に配送し、我々三人はあとから向かう。次男が熱を出していたというのもあるし、そのほうが義母の負担も少ないだろうというものだった。</p>

<p>諦めるのを諦めた一年だった。ウェブエンジニアになりたいなならなくちゃ絶対なってやる、という風潮もあったが到底無理な話だった。時間が取れない。次男は二月に一回発熱し、二日に一回夜中に起き出し、一日一回は暴れまわる。腰を落ち着けて、まとまった時間を使って勉強することはできなかった。それでもコードを書くのは嫌いではなかったので少しずつやることにした。工夫も何もなかった。彼が起きる前にコードを書き、起きてくればそれは終了された。</p>

<p>仕事はものすごい暇になったので、ほんとに暇を出されるのではと不安になったりした。社内の顧客から依頼された細々としたものごとを片付けて、その結果を社内でお知らせすることにした。（そういう風習があった）　わりと好評らしく、評価が上がった。評価が上がるということは給与が上がるということだ。そのようになった。</p>

<p>その調子で社内での自由度を高める活動にシフトした。自分がやりたいことと会社が求めていそうなことを合わせるようにして、提案する。許可されたので私は業務でコードが書けるようになった。なんということだ。</p>

<p>IPAのプロジェクトマネージャ試験を受けることにした。応用情報を取得して早二年。今年受けないと、一次免除の資格がなくなってしまうためだ。この学習はそれほど時間をかけていない。これは専門知識を問われることはあまりなく、国語の試験だった。準備しておいた経験談のみを書くのではなく、設問に対してちゃんと述べるように、調整した。そして合格した。</p>

<p>目標とか夢というものは、どこか遠くにあって、それに向かって走っていく。そうイメージしていた。しかし実態は違って、見方を変えると急にそれが隣にいたり、頭から降って湧いたり、背中をつんつんされる。そういうものだったのか。理解した。</p>

<p>来年はフィヨルドブートキャンプを卒業する。これは何があっても必ずやる。あとのことはどうでもいい。自分がやりたいことをやる。それさえできればいい。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/z7AFhafzBQE?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@artchicago?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Art Institute of Chicago</a></p>
]]></content:encoded><description>午後十時。抗生剤入りのジュースを次男は疑り深そうに眺めていた。しばらくして、ストローの先をそれにつけてぺろぺろ舐める様を、私たちは笑いを堪えながら見守っていた。それだけの年末である。 長男だけさきに妻の実家に配送し、我々三人はあとから向かう。次男が熱を出していたというのもあるし、そのほうが義母の負担も少ないだろうというものだった。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/7ad80e26d36f4a2218ff8354cafaf821ad9f5b34/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20241230%2F20241230155214.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>午後十時。抗生剤入りのジュースを次男は疑り深そうに眺めていた。しばらくして、ストローの先をそれにつけてぺろぺろ舐める様を、私たちは笑いを堪えながら見守っていた。それだけの年末である。 長男だけさきに妻の実家に配送し、我々三人はあとから向かう。次男が熱を出していたというのもあるし、そのほうが義母の負担も少ないだろうというものだった。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>午後十時。抗生剤入りのジュースを次男は疑り深そうに眺めていた。しばらくして、ストローの先をそれにつけてぺろぺろ舐める様を、私たちは笑いを堪えながら見守っていた。それだけの年末である。 長男だけさきに妻の実家に配送し、我々三人はあとから向かう。次男が熱を出していたというのもあるし、そのほうが義母の負担も少ないだろうというものだった。</itunes:summary></item><item><title>HotwireとWHITE BREATH</title><category>駄文</category><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sat, 28 Dec 2024 09:40:49 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398313292125</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20241221/20241221061746.jpg" width="1200" height="675" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>凍えそうな季節ではある。少し間前でHotLimitで悩んでいたのが嘘のようだ。長男はすでに起きていて、そばでYoutubeを観ている。以前は無音あるいは作業用BGMを流さないと文章が書けない私だったが、今はそうも言ってられない。</p>

<p>Hotwireという概念を学んでいる。これはJavaScriptを書きすぎずに、モダンなウェブアプリケーションをつくるための手法である。Railsのバージョン7以降からデフォルトに搭載されるようになっており、Railsで書ける。他の言語を学ぶ必要がなくなるため、一人で開発をする私にはあっている。はず。</p>

<p>HotwireはTurbo/ Stimulus/ Native　という三つの機能というかパーツというか概念がある。Turboは画面遷移を司り、Stimulusは状態管理を行う。Nativeは今ひとつわからないが、モバイルアプリを作る際につかうようだ。ここではStimulusだけを紹介しよう。</p>

<p>公式ドキュメントの紹介によるると、Turboでは既存のJavaScriptが必要な処理のうちの80%をカバーしている。部分的にレンダリングを行うことなど、いろいろできるようだ。残りの20%をStimulusがカバーできる。</p>

<p>Stimulusのドキュメントを追う。StimulusはJavaScriptのフレームワークである。核心なのはdata-controllerか。それはJavaScriptのオブジェクトであって、その中の要素を変化を監視し、変化によって様々な処理を行う。</p>

<p>そのなかにaction,target, valueがある。すこしわかってきた。</p>

<h1 id="Stimulusのはじまり">Stimulusのはじまり</h1>

<p>stimulusの環境構築が終わったら、divタグの中にdata-controllerという属性を設けて、コントローラーを宣言する。コントローラーの名前によってファイル名を参照するようだった。</p>

<pre class="code lang-html" data-lang="html" data-unlink> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">data</span><span class="synIdentifier">-controller=</span><span class="synConstant">&quot;simulationmode&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;simulation-controller&quot;</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span>
</pre>


<p><code>app/javascript/controllers/simulationmode_controller.js</code></p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synPreProc">import</span> <span class="synSpecial">{</span> Controller <span class="synSpecial">}</span> <span class="synPreProc">from</span> <span class="synConstant">&quot;@hotwired/stimulus&quot;</span><span class="synStatement">;</span>

<span class="synPreProc">export</span> <span class="synStatement">default</span> <span class="synStatement">class</span> <span class="synIdentifier">extends</span> Controller <span class="synSpecial">{</span>
<span class="synSpecial">}</span>
</pre>


<h1 id="初期状態の設定">初期状態の設定</h1>

<p><a href="https://stimulus.hotwired.dev/handbook/managing-state#lifecycle-callbacks-explained">https://stimulus.hotwired.dev/handbook/managing-state#lifecycle-callbacks-explained</a></p>

<p>コントローラーの中で <code>connect()</code> メソッドを宣言することで、コントローラーがDOMに接続された状態（この表現が正しいかわからない）ときの処理を書くことができる。今回は状態を管理させたいので、その値を設定させる。</p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synPreProc">import</span> <span class="synSpecial">{</span> Controller <span class="synSpecial">}</span> <span class="synPreProc">from</span> <span class="synConstant">&quot;@hotwired/stimulus&quot;</span><span class="synStatement">;</span>

<span class="synPreProc">export</span> <span class="synStatement">default</span> <span class="synStatement">class</span> <span class="synIdentifier">extends</span> Controller <span class="synSpecial">{</span>

  STATES <span class="synStatement">=</span> <span class="synSpecial">{</span>
    <span class="synIdentifier">SELECT</span><span class="synStatement">:</span> <span class="synConstant">&quot;select&quot;</span><span class="synStatement">,</span>
    <span class="synIdentifier">ADD_OPERATOR</span><span class="synStatement">:</span> <span class="synConstant">&quot;add-operator&quot;</span><span class="synStatement">,</span>
    <span class="synIdentifier">ADD_FACILITY</span><span class="synStatement">:</span> <span class="synConstant">&quot;add-facility&quot;</span><span class="synStatement">,</span>
  <span class="synSpecial">}</span><span class="synStatement">;</span>

  <span class="synIdentifier">connect</span><span class="synSpecial">()</span> <span class="synSpecial">{</span>
    <span class="synStatement">this.</span>State <span class="synStatement">=</span> <span class="synStatement">this.</span>STATES<span class="synStatement">.</span>SELECT<span class="synStatement">;</span>
    <span class="synConstant">console</span><span class="synStatement">.</span><span class="synIdentifier">log</span><span class="synSpecial">(</span><span class="synStatement">this.</span>State<span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synSpecial">}</span>
</pre>


<h1 id="イベントとの紐付け">イベントとの紐付け</h1>

<p>　ラジオボタンをつくり、それが押された時のイベントを設定させたい。<code>data-action</code> という属性でもって、メソッド名と紐付けを行う。今回は以下のように状態を管理するようなメソッドを作った。</p>

<pre class="code lang-html" data-lang="html" data-unlink> <span class="synIdentifier">&lt;</span><span class="synStatement">div</span><span class="synIdentifier"> </span><span class="synType">data</span><span class="synIdentifier">-controller=</span><span class="synConstant">&quot;simulationmode&quot;</span><span class="synIdentifier"> </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;simulation-controller&quot;</span><span class="synIdentifier">&gt;</span>
    <span class="synIdentifier">&lt;</span><span class="synStatement">fieldset</span><span class="synIdentifier">&gt;</span>
        <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>
          <span class="synIdentifier">&lt;</span><span class="synStatement">input</span>
<span class="synIdentifier">            </span><span class="synType">type</span><span class="synIdentifier">=</span><span class="synConstant">&quot;radio&quot;</span>
<span class="synIdentifier">            </span><span class="synType">name</span><span class="synIdentifier">=</span><span class="synConstant">&quot;mode&quot;</span>
<span class="synIdentifier">            </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;editMode&quot;</span>
<span class="synIdentifier">            </span><span class="synType">checked</span>
<span class="synIdentifier">            </span><span class="synType">data</span><span class="synIdentifier">-</span><span class="synType">action</span><span class="synIdentifier">=</span><span class="synConstant">&quot;simulationmode#edit&quot;</span><span class="synIdentifier">&gt;</span>
          <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>編集<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>
        <span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>
      <span class="synIdentifier">&lt;/</span><span class="synStatement">label</span><span class="synIdentifier">&gt;</span>
        <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>
          <span class="synIdentifier">&lt;</span><span class="synStatement">input</span>
<span class="synIdentifier">            </span><span class="synType">type</span><span class="synIdentifier">=</span><span class="synConstant">&quot;radio&quot;</span>
<span class="synIdentifier">            </span><span class="synType">name</span><span class="synIdentifier">=</span><span class="synConstant">&quot;mode&quot;</span>
<span class="synIdentifier">            </span><span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">&quot;simulateMode&quot;</span>
<span class="synIdentifier">            </span><span class="synType">data</span><span class="synIdentifier">-</span><span class="synType">action</span><span class="synIdentifier">=</span><span class="synConstant">&quot;simulationmode#checkSimulate&quot;</span><span class="synIdentifier">&gt;</span>
            <span class="synIdentifier">&lt;</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>実行<span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>
        <span class="synIdentifier">&lt;/</span><span class="synStatement">span</span><span class="synIdentifier">&gt;</span>
    <span class="synIdentifier">&lt;/</span><span class="synStatement">fieldset</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;/</span><span class="synStatement">div</span><span class="synIdentifier">&gt;</span>
</pre>


<p><code>app/javascript/controllers/simulationmode_controller.js</code></p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synPreProc">import</span> <span class="synSpecial">{</span> Controller <span class="synSpecial">}</span> <span class="synPreProc">from</span> <span class="synConstant">&quot;@hotwired/stimulus&quot;</span><span class="synStatement">;</span>

<span class="synPreProc">export</span> <span class="synStatement">default</span> <span class="synStatement">class</span> <span class="synIdentifier">extends</span> Controller <span class="synSpecial">{</span>
  STATES <span class="synStatement">=</span> <span class="synSpecial">{</span>
    <span class="synIdentifier">SELECT</span><span class="synStatement">:</span> <span class="synConstant">&quot;select&quot;</span><span class="synStatement">,</span>
    <span class="synIdentifier">ADD_OPERATOR</span><span class="synStatement">:</span> <span class="synConstant">&quot;add-operator&quot;</span><span class="synStatement">,</span>
    <span class="synIdentifier">ADD_FACILITY</span><span class="synStatement">:</span> <span class="synConstant">&quot;add-facility&quot;</span><span class="synStatement">,</span>
  <span class="synSpecial">}</span><span class="synStatement">;</span>

  <span class="synIdentifier">connect</span><span class="synSpecial">()</span> <span class="synSpecial">{</span>
    <span class="synStatement">this.</span>State <span class="synStatement">=</span> <span class="synStatement">this.</span>STATES<span class="synStatement">.</span>SELECT<span class="synStatement">;</span>
    <span class="synConstant">console</span><span class="synStatement">.</span><span class="synIdentifier">log</span><span class="synSpecial">(</span><span class="synStatement">this.</span>State<span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synSpecial">}</span>

  <span class="synIdentifier">edit</span><span class="synSpecial">()</span> <span class="synSpecial">{</span>
    <span class="synStatement">this.</span>State <span class="synStatement">=</span> <span class="synStatement">this.</span>STATES<span class="synStatement">.</span>SELECT<span class="synStatement">;</span>
    <span class="synConstant">console</span><span class="synStatement">.</span><span class="synIdentifier">log</span><span class="synSpecial">(</span><span class="synStatement">this.</span>State<span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synSpecial">}</span>

<span class="synSpecial">}</span>
</pre>


<h1 id="まとめ">まとめ</h1>

<p>このくらいのコード量なら純粋なJSを書いた方がはやい。しかし、もう少し複雑になってくるとHotwireのほうが管理がしやすくなる。フロントエンドのコードを新しく覚える必要がなく、少しずつ適用できるので個人開発には向いている。</p>

<p>Hotwireを積極的に使っていこう。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E9%9B%AA%E3%81%AB%E8%A6%86%E3%82%8F%E3%82%8C%E3%81%9F%E5%B1%B1%E3%80%85%E3%82%92%E8%83%8C%E6%99%AF%E3%81%AB%E3%81%97%E3%81%9F%E9%80%A3%E5%B3%A6-P94s4MYZpuc?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a><a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>凍えそうな季節ではある。少し間前でHotLimitで悩んでいたのが嘘のようだ。長男はすでに起きていて、そばでYoutubeを観ている。以前は無音あるいは作業用BGMを流さないと文章が書けない私だったが、今はそうも言ってられない。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/93bfb0a850c52895c2dfb58b5edfe6ace602e2a3/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20241221%2F20241221061746.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>凍えそうな季節ではある。少し間前でHotLimitで悩んでいたのが嘘のようだ。長男はすでに起きていて、そばでYoutubeを観ている。以前は無音あるいは作業用BGMを流さないと文章が書けない私だったが、今はそうも言ってられない。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>凍えそうな季節ではある。少し間前でHotLimitで悩んでいたのが嘘のようだ。長男はすでに起きていて、そばでYoutubeを観ている。以前は無音あるいは作業用BGMを流さないと文章が書けない私だったが、今はそうも言ってられない。</itunes:summary><itunes:keywords>駄文</itunes:keywords></item><item><title>時間とたたかうフィヨルドブートキャンプ</title><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sat, 7 Dec 2024 14:41:04 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398309564443</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20241207/20241207020047.jpg" width="1200" height="767" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　午前二時。一息で書き切らないといけない。子供が起きてひどいかんしゃくを起こし、妻が彼をつれてドライブに向かった。今日の予定は詰まっており、この時間帯でないと私は文章を書けない。そういうことになっている。</p>

<p><a href="https://adventar.org/calendars/10357">フィヨルドブートキャンプアドベントカレンダー 2024</a>の7日目の記事である。</p>

<p>　昨年よりフィヨルドブートキャンプというスクールに入会している。カリキュラムが難しい、という話も聞くが、私にとってはそれほど問題にはならない。一番の問題は時間の確保である。</p>

<p>普通にフルタイムで仕事をしていて、家に帰ると子供らの相手をしている。休日も同様。そうなってくると彼らが寝ている時間でしかカリキュラムを進めることができない。一日に使えるのは一時間程度。運が良ければ二時間できる。</p>

<p>これ以上時間を確保するのは難しい。睡眠時間を削ることもできるが、やりすぎると体調を崩し、パフォーマンスが下がる。（何度かそういうことがあった）</p>

<p>しかし、解決策がないわけではない。頭の中でコードを書くことにした。カリキュラムを進めるには、方法を考えて実装するを繰り返すだけ。考えることはPCに向かわなくてもできるのだ。</p>

<p>思考とは言葉である。フィヨルドブートキャンプの日報に実装方針やエラーの原因を書き残す。そうすることで、何をやるかが明確になり、少ない時間でコードがかける。</p>

<p>そういう感じで進めていった。</p>

<p>裏技がないわけではない。会社でフィヨルドブートキャンプを取り組めればいいわけだ。現在自作サービスのカリキュラムを進行中だが、この成果物を会社で公開するよう調整できた。つまりは業務時間内に自作サービスが進められるのだ。</p>

<p>二拠点開発が可能となった。自宅でバックエンドをやり、会社でフロントエンドをやる。ブランチを切りながらやれる。かけられる時間は倍になる。</p>

<p>このように、常に時間とたたかっている。</p>

<p>おわり。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E6%9B%87%E3%82%8A%E7%A9%BA%E3%81%AE%E4%B8%8B%E9%9B%AA%E3%81%AB%E8%A6%86%E3%82%8F%E3%82%8C%E3%81%9F%E5%B1%B1-btxvB91W47Q?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>午前二時。一息で書き切らないといけない。子供が起きてひどいかんしゃくを起こし、妻が彼をつれてドライブに向かった。今日の予定は詰まっており、この時間帯でないと私は文章を書けない。そういうことになっている。 フィヨルドブートキャンプアドベントカレンダー 2024の7日目の記事である。 昨年よりフィヨルドブートキャンプというスクールに入会している。カリキュラムが難しい、という話も聞くが、私にとってはそれほど問題にはならない。一番の問題は時間の確保である。 普通にフルタイムで仕事をしていて、家に帰ると子供らの相手をしている。休日も同様。そうなってくると彼らが寝ている時間でしかカリキュラムを進めることが…</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/aebb8e8def99259596e5ecf7df19442854a0a586/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20241207%2F20241207020047.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>午前二時。一息で書き切らないといけない。子供が起きてひどいかんしゃくを起こし、妻が彼をつれてドライブに向かった。今日の予定は詰まっており、この時間帯でないと私は文章を書けない。そういうことになっている。 フィヨルドブートキャンプアドベントカレンダー 2024の7日目の記事である。 昨年よりフィヨルドブートキャンプというスクールに入会している。カリキュラムが難しい、という話も聞くが、私にとってはそれほど問題にはならない。一番の問題は時間の確保である。 普通にフルタイムで仕事をしていて、家に帰ると子供らの相手をしている。休日も同様。そうなってくると彼らが寝ている時間でしかカリキュラムを進めることが…</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>午前二時。一息で書き切らないといけない。子供が起きてひどいかんしゃくを起こし、妻が彼をつれてドライブに向かった。今日の予定は詰まっており、この時間帯でないと私は文章を書けない。そういうことになっている。 フィヨルドブートキャンプアドベントカレンダー 2024の7日目の記事である。 昨年よりフィヨルドブートキャンプというスクールに入会している。カリキュラムが難しい、という話も聞くが、私にとってはそれほど問題にはならない。一番の問題は時間の確保である。 普通にフルタイムで仕事をしていて、家に帰ると子供らの相手をしている。休日も同様。そうなってくると彼らが寝ている時間でしかカリキュラムを進めることが…</itunes:summary></item><item><title>会社でコードを書けるようになった</title><category>駄文</category><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sun, 1 Dec 2024 06:00:00 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398307834740</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20241130/20241130061752.jpg" width="1200" height="675" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<p>　大学時代の夢を見た。サークルのメンバーが書いていたノートが部室にあって、私はその表紙だけちらと確認していた。そのサークルは文章を書くのが主な活動だったが、私はほとんど幽霊のように存在していた。なぜそこに入ったのか、あまり覚えていない。目覚めてからそのサークルを調べてみたが、いまも実在しているようだ。すこし安心した。</p>

<p>　まったく関係のない話をしていた。これは<a href="https://adventar.org/calendars/10296">エンジニアと人生 Advent Calendar 2024</a>の一日目の記事。タイトルだけ決まっていたから、あとは好きに書こう。</p>

<p>　数年前に「未経験エンジニア転職を諦めた」という話をした。</p>

<p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fmatoyomi.hatenablog.com%2Fentry%2F20220822%2F1661111764" title="30代未経験からのエンジニア転職を諦めた話 - マトリョーシカ的日常" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://matoyomi.hatenablog.com/entry/20220822/1661111764">matoyomi.hatenablog.com</a></cite></p>

<p>現職では図面を書いたり機械の修理をしたり、ものをつくったりしている。機械系エンジニアと呼ばれる職種である。記事に対するコメントで「すでにエンジニアでは？」「エンジニアをITエンジニアの意味合いで使うな」という内容をいただいた。確かにそうだった。</p>

<p>　それでもコードが書きたかった。寝食を忘れるほど好きと言うわけではなかったが、嫌いではなかった。なんというか、しっくりきた。毎朝趣味のリポジトリにコミットを積んだり、ロジックの中身を考えたり、エラーの原因を考えたり。そういうふうに時間を使うのが自分の中で非常に自然で楽であった。</p>

<p>　好きなことを仕事にしたい。コードを書くことを業務でできればどんなに良いか。</p>

<p>　以前に「なぜ あなたの仕事は終わらないのか」という本を読んだ。「好きなことを仕事にすれば集中力を上げる必要もなく、仕事を早く終わらせることができる」という趣旨だった。著者は好きなことを仕事にしようぜ、という人間らしかった。これは意見が分かれるところなので、絶対そのほうがいい、とはならない。でも私は好きなことを仕事にしたい人だった。なるほど。</p>

<p>　やりたいならやろう。社内で少しずつIT系の仕事をとっていくことにしていた。とるというより、自分で率先して仕事をつくっていた。マイコンを使って設備の稼働状況を表示させたり、あるセンサーが閾値を超えたらメールでお知らせが届くようにした。そんな俺俺システムをつくっては、社内で発表した。</p>

<p>　しかし進捗は良くなかった。本業の合間をぬって作業をしているから仕方ない。これが本業であればどんなに良いか。あともうひと押しなにかあれば変わりそうな空気ではあった。</p>

<p>　そこで社内の体制が変わった。具体的なことは書けないが、今の職種のまま社内でコードを書けるようになった。機械設計の傍ら、Githubのリポジトリにpushができる。これはもうITエンジニアのようなものだ。現在作成しているシステムがどのような運用になるかわからない。わからないが、やりたいことに近づいたのは確かだ。</p>

<p>　本当のことをいうと、この経歴が社外からみても実務経験とみてもらえたらありがたい。そのためにはもっとコードを書く必要があって、それを発信する場所も必要だ。現職はかなり自由だ。自由なうちに会社で使えるものはすべてつかっていこう。そしていつかは宇宙に行く。</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E6%9B%87%E3%82%8A%E7%A9%BA%E3%81%AE%E4%B8%8B%E9%9B%AA%E3%81%AB%E8%A6%86%E3%82%8F%E3%82%8C%E3%81%9F%E5%B1%B1-UDrhbSiXh8M?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>大学時代の夢を見た。サークルのメンバーが書いていたノートが部室にあって、私はその表紙だけちらと確認していた。そのサークルは文章を書くのが主な活動だったが、私はほとんど幽霊のように存在していた。なぜそこに入ったのか、あまり覚えていない。目覚めてからそのサークルを調べてみたが、いまも実在しているようだ。すこし安心した。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/421dd0f35b43af5da421942a309cc9003004a113/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20241130%2F20241130061752.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>大学時代の夢を見た。サークルのメンバーが書いていたノートが部室にあって、私はその表紙だけちらと確認していた。そのサークルは文章を書くのが主な活動だったが、私はほとんど幽霊のように存在していた。なぜそこに入ったのか、あまり覚えていない。目覚めてからそのサークルを調べてみたが、いまも実在しているようだ。すこし安心した。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>大学時代の夢を見た。サークルのメンバーが書いていたノートが部室にあって、私はその表紙だけちらと確認していた。そのサークルは文章を書くのが主な活動だったが、私はほとんど幽霊のように存在していた。なぜそこに入ったのか、あまり覚えていない。目覚めてからそのサークルを調べてみたが、いまも実在しているようだ。すこし安心した。</itunes:summary><itunes:keywords>駄文</itunes:keywords></item><item><title>DOM操作を含むJavaScriptコードをJestでテストした</title><category>駄文</category><author>noemail@noemail.org (kyokucho1989)</author><pubDate>Sat, 2 Nov 2024 16:28:43 +0900</pubDate><guid isPermaLink="false">hatenablog://entry/6802418398300852886</guid><content:encoded xmlns:content="http://purl.org/rss/1.0/modules/content/"><![CDATA[<p><span itemscope itemtype="http://schema.org/Photograph"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/k/kyokucho1989/20241102/20241102162706.jpg" width="1200" height="806" loading="lazy" title="" class="hatena-fotolife" itemprop="image"></span></p>

<h1 id="前書き">前書き</h1>

<p>　午前中ずっと降り続いていた雨は突然として止み、子供らが庭にわらわらと集まってきた。最近はけん玉がブーム用で、お互いが技を繰り出している。空気中のちりほこりが雨で洗い流されたためか、空気澄んでいる。平和な世界だ。</p>

<h1 id="Webサービスの話">Webサービスの話</h1>

<p>　WEBサービスを引き続きつくっている。JavaScriptのテストを書いていた。入力フォームに値を入れて保存を押すと、任意のJavaScriptのオブジェクトの値が変わる。実際にはしっかりと動作していているが、これをテストするのに少し苦労した。忘れても良いように、ここに書いておく。</p>

<p>　JavaScriptのテストツールはJestを導入した。ドキュメントも日本語のものがあり、参考になるページが多くありそうだったためだ。JestだけでなくTesting Libraryというツールも導入する。</p>

<p><a href="https://jestjs.io/">Jest &middot; &#x1F0CF; Delightful JavaScript Testing</a></p>

<p><a href="https://testing-library.com/">Testing Library | Testing Library</a></p>

<h2 id="コードの紹介">コードの紹介</h2>

<p>　はじめにテストしたい関数をexportする。今回は<code>app/javascript/src/simulation.js</code>　の一部である。</p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synComment">//略</span>
<span class="synPreProc">export</span> <span class="synStatement">function</span> <span class="synIdentifier">setObjectparams</span><span class="synSpecial">(</span>e<span class="synStatement">,</span> params<span class="synStatement">,</span> facilities<span class="synStatement">,</span> facilityDialog<span class="synSpecial">)</span> <span class="synSpecial">{</span>
  e<span class="synStatement">.</span><span class="synIdentifier">preventDefault</span><span class="synSpecial">()</span><span class="synStatement">;</span> 
  <span class="synType">let</span> id <span class="synStatement">=</span> params<span class="synStatement">.</span>id<span class="synStatement">;</span>
  <span class="synType">let</span> name <span class="synStatement">=</span> params<span class="synStatement">.</span>name<span class="synStatement">;</span>
  <span class="synType">let</span> processingTime <span class="synStatement">=</span> params<span class="synStatement">.</span>processingTime<span class="synStatement">;</span>
  <span class="synType">let</span> selectedFacility <span class="synStatement">=</span> facilities<span class="synStatement">.</span><span class="synIdentifier">find</span><span class="synSpecial">((</span>facility<span class="synSpecial">)</span> <span class="synStatement">=&gt;</span> facility<span class="synStatement">.</span>id <span class="synStatement">==</span> id<span class="synStatement">.</span>value<span class="synSpecial">)</span><span class="synStatement">;</span>
  selectedFacility<span class="synStatement">.</span>name <span class="synStatement">=</span> name<span class="synStatement">.</span>value<span class="synStatement">;</span>
  selectedFacility<span class="synStatement">.</span>processingTime <span class="synStatement">=</span> processingTime<span class="synStatement">.</span>value<span class="synStatement">;</span>
  facilityDialog<span class="synStatement">.</span>close<span class="synStatement">;</span>
<span class="synSpecial">}</span>

<span class="synComment">// 略</span>
<span class="synPreProc">export</span> <span class="synStatement">function</span> <span class="synIdentifier">setFacilityDataToModal</span><span class="synSpecial">(</span>facility<span class="synSpecial">)</span> <span class="synSpecial">{</span>
  <span class="synType">let</span> id <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">getElementById</span><span class="synSpecial">(</span><span class="synConstant">&quot;hidden-id&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synType">let</span> name <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">getElementById</span><span class="synSpecial">(</span><span class="synConstant">&quot;name&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synType">let</span> processingTime <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">getElementById</span><span class="synSpecial">(</span><span class="synConstant">&quot;processingTime&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>

  id<span class="synStatement">.</span>value <span class="synStatement">=</span> facility<span class="synStatement">.</span>id<span class="synStatement">;</span>
  name<span class="synStatement">.</span>value <span class="synStatement">=</span> facility<span class="synStatement">.</span>name<span class="synStatement">;</span>
  processingTime<span class="synStatement">.</span>value <span class="synStatement">=</span> facility<span class="synStatement">.</span>processingTime<span class="synStatement">;</span>
<span class="synSpecial">}</span>
</pre>


<p>　次にテストファイルを作成する。<code>app/javascript/test/savesimulation.test.js</code> とした。</p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synPreProc">import</span> <span class="synSpecial">{</span> fireEvent<span class="synStatement">,</span> screen<span class="synStatement">,</span> waitFor <span class="synSpecial">}</span> <span class="synPreProc">from</span> <span class="synConstant">&quot;@testing-library/dom&quot;</span><span class="synStatement">;</span>
<span class="synPreProc">import</span> <span class="synConstant">&quot;@testing-library/jest-dom&quot;</span><span class="synStatement">;</span>

<span class="synPreProc">import</span> <span class="synSpecial">{</span> setObjectparams <span class="synSpecial">}</span> <span class="synPreProc">from</span> <span class="synConstant">&quot;../src/simulation.js&quot;</span><span class="synStatement">;</span>
<span class="synPreProc">import</span> <span class="synSpecial">{</span> setFacilityDataToModal <span class="synSpecial">}</span> <span class="synPreProc">from</span> <span class="synConstant">&quot;../src/simulation.js&quot;</span><span class="synStatement">;</span>
<span class="synType">let</span> facilities<span class="synStatement">;</span>
<span class="synType">let</span> facilitiesInitial<span class="synStatement">;</span>

<span class="synIdentifier">beforeEach</span><span class="synSpecial">(()</span> <span class="synStatement">=&gt;</span> <span class="synSpecial">{</span>
<span class="synComment">//略</span>
  facilities <span class="synStatement">=</span> facilitiesInitial<span class="synStatement">;</span>
<span class="synSpecial">})</span><span class="synStatement">;</span>

<span class="synIdentifier">test</span><span class="synSpecial">(</span><span class="synConstant">&quot;button click and set params&quot;</span><span class="synStatement">,</span> <span class="synStatement">async</span> <span class="synSpecial">()</span> <span class="synStatement">=&gt;</span> <span class="synSpecial">{</span>
<span class="synComment">//　ここにテストを書く</span>
<span class="synSpecial">})</span><span class="synStatement">;</span>
</pre>


<h3 id="解説">解説</h3>

<p>　<code>import { fireEvent, screen, waitFor } from "@testing-library/dom";</code> で　<code>@testing-library/dom</code>　から <code>fireEvent</code> などのオブジェクトを扱えるようになる。</p>

<p>　<code>import { setObjectparams } from "../src/simulation.js";</code>　でローカルのファイルからexportされた関数 <code>setObjectparams</code> が使える。</p>

<p>　<code>beforeEach</code> は各テストが実行される前に処理される部分。 <code>test(..</code> はテストだ。今回は非同期処理を含むので、引数の指定に非同期処理の関数 <code>async</code> が入っている。</p>

<h2 id="テストを書く">テストを書く</h2>

<h3 id="1-テスト用にDOMをセットアップ">1. テスト用にDOMをセットアップ</h3>

<p>　実際のサービスで使うDOMでなく、テスト用のDOMを準備する。</p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synIdentifier">test</span><span class="synSpecial">(</span><span class="synConstant">&quot;button click and set params&quot;</span><span class="synStatement">,</span> <span class="synStatement">async</span> <span class="synSpecial">()</span> <span class="synStatement">=&gt;</span> <span class="synSpecial">{</span>
  <span class="synType">const</span> div <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">createElement</span><span class="synSpecial">(</span><span class="synConstant">&quot;div&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
  div<span class="synStatement">.</span>innerHTML <span class="synStatement">=</span> <span class="synConstant">`</span>
<span class="synConstant">    &lt;dialog id=&quot;facilityDialog&quot;&gt;</span>
<span class="synConstant">      &lt;div id=&quot;hidden-id&quot; hidden&gt;&lt;/div&gt;</span>
<span class="synConstant">      &lt;div&gt;</span>
<span class="synConstant">        &lt;label for=&quot;name&quot;&gt;設備名&lt;/label&gt;</span>
<span class="synConstant">        &lt;input type=&quot;text&quot; id=&quot;name&quot; name=&quot;name&quot; maxlength=&quot;16&quot; size=&quot;15&quot; /&gt;</span>
<span class="synConstant">      &lt;/div&gt;</span>
<span class="synConstant">      &lt;div&gt;</span>
<span class="synConstant">        &lt;label for=&quot;processingTime&quot;&gt;加工時間&lt;/label&gt;</span>
<span class="synConstant">        &lt;input type=&quot;number&quot; id=&quot;processingTime&quot; name=&quot;name&quot; min=&quot;0&quot; max=&quot;400&quot; /&gt;</span>
<span class="synConstant">      &lt;/div&gt;</span>
<span class="synConstant">      &lt;div&gt;</span>
<span class="synConstant">        &lt;button id=&quot;confirmBtn&quot; value=&quot;default&quot;&gt;保存&lt;/button&gt;</span>
<span class="synConstant">      &lt;/div&gt;</span>
<span class="synConstant">    &lt;/dialog&gt;</span>
<span class="synConstant">  `</span><span class="synStatement">;</span>
  <span class="synConstant">document</span><span class="synStatement">.</span>body<span class="synStatement">.</span><span class="synIdentifier">appendChild</span><span class="synSpecial">(</span>div<span class="synSpecial">)</span><span class="synStatement">;</span> 
</pre>


<h3 id="2-値のセットと値の取得">2. 値のセットと値の取得</h3>

<p>　実際の作成した関数 <code>setFacilityDataToModal()</code> を使って、テスト用のDOMの入力フォームに値をセットしておく。それができたら次はDOM上から名前と加工時間を取得する。</p>

<p>　<code>fireEvent.change</code> を使うことでフォームに値を入力させることができる。</p>

<p>　あとはボタンを押した時のイベントを追加する。</p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink>  <span class="synStatement">document</span>.body<span class="synStatement">.</span><span class="synIdentifier">appendChild</span><span class="synSpecial">(</span>div<span class="synSpecial">)</span><span class="synStatement">;</span> 
  <span class="synIdentifier">setFacilityDataToModal</span><span class="synSpecial">(</span>facilities<span class="synSpecial">[</span><span class="synConstant">0</span><span class="synSpecial">])</span><span class="synStatement">;</span>

  <span class="synType">const</span> nameInput <span class="synStatement">=</span> screen<span class="synStatement">.</span><span class="synIdentifier">getByLabelText</span><span class="synSpecial">(</span><span class="synConstant">&quot;設備名&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synType">const</span> processingTimeInput <span class="synStatement">=</span> screen<span class="synStatement">.</span><span class="synIdentifier">getByLabelText</span><span class="synSpecial">(</span><span class="synConstant">&quot;加工時間&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>

  fireEvent<span class="synStatement">.</span><span class="synIdentifier">change</span><span class="synSpecial">(</span>nameInput<span class="synStatement">,</span> <span class="synSpecial">{</span> <span class="synIdentifier">target</span><span class="synStatement">:</span> <span class="synSpecial">{</span> <span class="synIdentifier">value</span><span class="synStatement">:</span> <span class="synConstant">&quot;Test Facility&quot;</span> <span class="synSpecial">}</span> <span class="synSpecial">})</span><span class="synStatement">;</span>
  fireEvent<span class="synStatement">.</span><span class="synIdentifier">change</span><span class="synSpecial">(</span>processingTimeInput<span class="synStatement">,</span> <span class="synSpecial">{</span> <span class="synIdentifier">target</span><span class="synStatement">:</span> <span class="synSpecial">{</span> <span class="synIdentifier">value</span><span class="synStatement">:</span> <span class="synConstant">30</span> <span class="synSpecial">}</span> <span class="synSpecial">})</span><span class="synStatement">;</span>

  <span class="synType">const</span> button <span class="synStatement">=</span> screen<span class="synStatement">.</span><span class="synIdentifier">getByText</span><span class="synSpecial">(</span><span class="synConstant">&quot;保存&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
  button<span class="synStatement">.</span><span class="synIdentifier">addEventListener</span><span class="synSpecial">(</span><span class="synConstant">&quot;click&quot;</span><span class="synStatement">,</span> <span class="synSpecial">(</span>e<span class="synSpecial">)</span> <span class="synStatement">=&gt;</span> <span class="synSpecial">{</span>
    <span class="synType">let</span> params <span class="synStatement">=</span> <span class="synSpecial">{}</span><span class="synStatement">;</span>
    params<span class="synStatement">.</span>id <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">getElementById</span><span class="synSpecial">(</span><span class="synConstant">&quot;hidden-id&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
    params<span class="synStatement">.</span>name <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">getElementById</span><span class="synSpecial">(</span><span class="synConstant">&quot;name&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
    params<span class="synStatement">.</span>processingTime <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">getElementById</span><span class="synSpecial">(</span><span class="synConstant">&quot;processingTime&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
    <span class="synType">let</span> facilityDialog <span class="synStatement">=</span> <span class="synConstant">document</span><span class="synStatement">.</span><span class="synIdentifier">getElementById</span><span class="synSpecial">(</span><span class="synConstant">&quot;facilityDialog&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>

    <span class="synIdentifier">setObjectparams</span><span class="synSpecial">(</span>e<span class="synStatement">,</span> params<span class="synStatement">,</span> facilities<span class="synStatement">,</span> facilityDialog<span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synSpecial">})</span><span class="synStatement">;</span>
</pre>


<p>　</p>

<h3 id="3-DOM操作が終わったあとに差異をみる">3. DOM操作が終わったあとに差異をみる</h3>

<p>　テストコードの中でボタンを押し、そのイベントによってDOMが操作される。（今回はモーダルウィンドウが閉じる）さらにはJavaScriptの変数の中身が変わる。それをテストする。</p>

<pre class="code lang-javascript" data-lang="javascript" data-unlink>
<span class="synComment">//上のコードのつづき</span>
  <span class="synStatement">await</span> fireEvent<span class="synStatement">.</span><span class="synIdentifier">click</span><span class="synSpecial">(</span>button<span class="synSpecial">)</span><span class="synStatement">;</span>

  <span class="synStatement">await</span> <span class="synIdentifier">waitFor</span><span class="synSpecial">(()</span> <span class="synStatement">=&gt;</span> <span class="synIdentifier">expect</span><span class="synSpecial">(</span>screen<span class="synStatement">.</span><span class="synIdentifier">queryByText</span><span class="synSpecial">(</span><span class="synConstant">&quot;設備名&quot;</span><span class="synSpecial">))</span><span class="synStatement">.</span>not<span class="synStatement">.</span><span class="synIdentifier">toBeVisible</span><span class="synSpecial">())</span><span class="synStatement">;</span>
  <span class="synType">let</span> selectedFacility <span class="synStatement">=</span> facilities<span class="synStatement">.</span><span class="synIdentifier">find</span><span class="synSpecial">((</span>facility<span class="synSpecial">)</span> <span class="synStatement">=&gt;</span> facility<span class="synStatement">.</span>id <span class="synStatement">==</span> <span class="synConstant">&quot;n0&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synIdentifier">expect</span><span class="synSpecial">(</span>selectedFacility<span class="synStatement">.</span>processingTime<span class="synSpecial">)</span><span class="synStatement">.</span><span class="synIdentifier">toBe</span><span class="synSpecial">(</span><span class="synConstant">&quot;30&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
  <span class="synIdentifier">expect</span><span class="synSpecial">(</span>selectedFacility<span class="synStatement">.</span>name<span class="synSpecial">)</span><span class="synStatement">.</span><span class="synIdentifier">toBe</span><span class="synSpecial">(</span><span class="synConstant">&quot;Test Facility&quot;</span><span class="synSpecial">)</span><span class="synStatement">;</span>
</pre>


<p><code>waitFor...</code> を使うことで、モーダルが閉じてからそれ以降のアサーションを実行できる。モーダルウィンドウが閉じるのはDOMがなくなるわけではなく、見えなくなるだけである。だから<code>not.toBeVisible()</code> を使っている。</p>

<p>以上。だいぶ長くなってしまった。
　</p>

<p><a href="https://unsplash.com/ja/%E5%86%99%E7%9C%9F/%E6%BA%80%E5%A4%A9%E3%81%AE%E6%98%9F%E7%A9%BA%E3%81%AB%E7%85%A7%E3%82%89%E3%81%95%E3%82%8C%E3%81%9F%E9%9B%AA%E5%B1%B1-08sFWNE3NQI?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a> <a href="https://unsplash.com/ja/@marekpiwnicki?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Marek Piwnicki</a></p>
]]></content:encoded><description>前書き 午前中ずっと降り続いていた雨は突然として止み、子供らが庭にわらわらと集まってきた。最近はけん玉がブーム用で、お互いが技を繰り出している。空気中のちりほこりが雨で洗い流されたためか、空気澄んでいる。平和な世界だ。</description><enclosure length="0" type="image/jpeg" url="https://cdn.image.st-hatena.com/image/scale/a797aba3c2baf4f210004dd2937cdfe9ad555ff2/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkyokucho1989%2F20241102%2F20241102162706.jpg"/><itunes:explicit>no</itunes:explicit><itunes:subtitle>前書き 午前中ずっと降り続いていた雨は突然として止み、子供らが庭にわらわらと集まってきた。最近はけん玉がブーム用で、お互いが技を繰り出している。空気中のちりほこりが雨で洗い流されたためか、空気澄んでいる。平和な世界だ。</itunes:subtitle><itunes:author>noemail@noemail.org (kyokucho1989)</itunes:author><itunes:summary>前書き 午前中ずっと降り続いていた雨は突然として止み、子供らが庭にわらわらと集まってきた。最近はけん玉がブーム用で、お互いが技を繰り出している。空気中のちりほこりが雨で洗い流されたためか、空気澄んでいる。平和な世界だ。</itunes:summary><itunes:keywords>駄文</itunes:keywords></item></channel></rss>