Next.js でブログを書いて Vercel でホストしている話

今年の中旬に転職してから、まとまった量の TypeScript (React) コードを書くようになり、その流れで Next.js にも興味を持つようになった。Next.js の公式ドキュメントでは “CREATE YOUR FIRST APP” セクションでブログを作成している。チュートリアル的な内容とはいえ、写経していくと、それなりにきちんと動くものができあがる。Next.js および、ドキュメントを書いた方の力量は素晴らしいと思う。

一通り理解した後で、同じ内容を TypeScript で書き直し、CSS を SASS で置き換え、Vercel にデプロイした。しばらくは新規のブログ記事はこちらに書いていこうと思う。まだまだ道半ばなブログで、たとえば RSS フィードなどがないし、ページングなども実装されていない。それらについても折を見て実装していこうと思う。

今後ともどうぞよろしくお願いします。

ブログを書く理由

ブログを書く動機について、現時点でのメモを残しておこうと思う。

僕の職業プログラマーとしてのキャリアは、2005 年にブログサービスを作ることからはじまっている。ブログというサービスにはそれなりの愛着がある。

過去には Movable Type を「さくらのインターネット」でホストして、気が向いたときに記事を書いた。はてなダイアリーにも日記を書いていた。今ではどちらも閉じていて、履歴も残っていない。はてなダイアリーは、友人から「自分を特定できるような書き方の記事があるので (その記事を) 消して欲しい」と言われ、そのタイミングで「面倒なので全て消すか」と思い、アカウントごと削除した (補足: 一般に特定できるように書いてはいないが、近い人間からは推測がついてしまう、というレベル)。また、同じようなタイミングで自分でホストしていた Movable Type も消した。

この決断には後悔している。

自分のブログの一番の読者は自分だと思う。何かを検索したときに自分のブログ記事がひっかかる確率は高い。昔の自分が解決した困りごとでも、時間が経てば解決方法を忘れてしまう。そうなったときに頼りになるのは昔の自分からの便りである。それを捨てるなんてとんでもない!!

昔の自分の記事を読むと恥ずかしい気持ちになることもある。たとえば 2012 年に自分が書いた JVM の実行オプションのメモ書きを読むと、「君はそんなことも知らなかったのか…」という気持ちになる。でも、こういう記事こそ消してはいけないものだと今は思う。こういう記事のおかげで、今の自分は昔より「少しはマシだ」と思える。

自分が、自分のために、ブログを書いている、というスタンスは大事にしていきたい。過去には Google Analytics を入れてアクセス解析をしたこともあるけど、Google Analytics 4 へのアップデートがアナウンスされたタイミングで、ブログからアクセス解析機能を落とした。自分のためのブログに、他人がどのくらい訪れるか気にするのは変だと思う。もちろん、書いていることが自分以外の誰かのためになれば嬉しいけど、主目的ではない。

同じような理由から、ブログをバズらせたいとは思わない。むしろ、バズりたくない。少なくとも自分の手で、ブログ記事をソーシャルメディアで拡散するようなことはしない。

ブログを公開することで、未来の自分に今の自分の理解を伝えたい。公開することで、間違ったことを書かないように自分自身を律したい。昔の自分の記事を「ばかばかしい記事だ」と思えるのであれば、それは喜ばしいこと。そういう気持ちで、今はブログを書いている。

アジャイル、スクラム、エクストリームプログラミング

アジャイルとエクストリームプログラミングの関係について、同僚と色々と話をした。この記事は自分自身の理解内容をメモする目的で書いた。 アジャイルとは何か? 「アジャイル」の原典はアジャイルマニフェストであり、ここに書かれている価値観のことを「アジャイル」と言う。 私たちは、ソフトウェア開発の実践 あるいは実践を手助けをする活動を通じて、 よりよい開発方法を見つけだそうとしている。 この活動を通して、私たちは以下の価値に至った。 プロセスやツールよりも 個人と対話 を、 包括的なドキュメントよりも 動くソフトウェア を、 契約交渉よりも 顧客との協調 を、 計画に従うことよりも 変化への対応 を、 価値とする。すなわち、左記のことがらに価値があることを 認めながらも、私たちは右記のことがらにより価値をおく。 ここで気づくことは 2 点ある。 ひとつは旧来のソフトウェア開発手法を否定していないことだ。「左記のことがらに価値があることを認めながらも」と言っている。旧来の「プロセスやツール、ドキュメント」などにも価値を認めているのである。単に「それより価値のあるものがある」と述べているに過ぎない。 もうひとつは「How」がまったく書かれていないことである。すなわち「で、どうすればいいの?」についてはアジャイルマニフェストの範囲外、ということである。そして、この How にあたる部分が「スクラム」であり「エクストリームプログラミング」である。 スクラムとは何か? 「スクラム」の原典はスクラムガイドである。この資料ではスクラムの定義を次のようにしている。 スクラムとは、複雑な問題に対応する適応型のソリューションを通じて、⼈々、チーム、組織が価値を⽣み出すための軽量級フレームワークである。 この「軽量級フレームワーク」はソフトウェア開発に限定したものではない。「スクラムガイド」本文には “ソフトウェア” や “プログラム” という言葉は現れない (注: 前書きに一箇所だけ出てくる)。つまり、スクラムはあらゆる種類のモノ作りに対応しているが、これをソフトウェア開発に適用するとなると、それ相応の解釈が必要になる。 この解釈の違いがスクラム開発のバラエティを生んでいる。つまり「スクラムで開発をしています」と言うチームが複数あるとき、そのプラクティスの詳細は異なることが多々ある。 エクストリームプログラミングとは何か? 「エクストリームプログラミング」の原典は同名の書籍である。この書籍の第七章の見出しは次の通りである。 7.1 全員同席(Sit Together) 7.2 チーム全体(Whole Team) 7.3 情報満載のワークスペース(Informative Workspace) 7.4 いきいきとした仕事(Energized Work) 7.5 ペアプログラミング(Pair Programming) 7.6 ストーリー(Stories) 7.7 週次サイクル(Weekly Cycle) 7.8 四半期サイクル(Quarterly Cycle) 7. [Read More]

仙台旅行 in 2022

仙台市内の実家に住んでいる両親に孫の顔を見せるべく、先月末 (2022年05月) に妻子を連れて帰省した。第二子は人見知りの激しい時期で両親にはあまり懐かなくて少し残念。それでも家族全員、総じてよい体験ができたのではないかと思う。

記録のため、乳幼児連れで楽しめた場所をメモしておこうと思う。

JRフルーツパーク仙台あらはま

「JRフルーツパーク仙台あらはま」は 2021 年に開業した施設である。2011 年の東日本大震災で被災した場所を整地し、営業している。子どもに果物狩りを体験させたくて訪れた。年間を通して様々な種類の果物狩りをさせてくれる。僕たちが訪れた時期はいちご狩りのシーズンであった。

JRフルーツパーク仙台あらはまのマップ

土曜日であったにも関わらず、僕たちの他にもう一組しかビニールハウスにおらず、かなり広い空間を楽しむことができた。いちごも甘くて美味しいものが生っており、親子ともに大満足であった。

いちご狩り

海岸公園馬術壌

子どもに馬を間近で見る機会を持たせたく、訪れた。前述の「JRフルーツパーク仙台あらはま」とは近い場所にある。乗馬レッスンなどもしているようだけど、僕たちは「引き馬 (インストラクターが引いてくれる馬に乗る)」と「餌やり体験」だけ楽しんだ。長男は怖がったので引き馬は途中で断念したものの、餌やりは楽しめたようである。

まだ乳児である次男は特に何もできなかったけど、彼が引き馬を楽しめる年齢になったらまた来てもいいかと思った。

引き馬体験

南小泉交通公園

仙台市にいくつかある交通公園の内、滞在先から行きやすかったのが南小泉交通公園である。長男はまだ自転車に不慣れなので、自動車がばんばん走る道路に出す前に少しトレーニングを積ませたいと思っていた。園内で貸し出している三輪車に慣れるのに手間取ったけど、それなりに楽しめているようであった。

テスト駆動開発のライブデモ

テスト駆動開発について学んでいる。手始めに、かの有名な @t_wada さんのライブコーディングデモ動画を眺めてみた。

テスト駆動開発については耳年増のようになっており、「Red -> Green -> Refactoring」のマントラや「プログラムのテストはテストコードで行い、テストコードのテストはプログラムで行う」という考え方については「知識としては知っている」という状態であった。「…とはいえ、実際にテスト駆動で開発を進めるのは難しいよね」と思っていたが、デモ動画を通して、それが「現実世界で実行できるプラクティスなんだな」と感じられた。

耳年増な自分が知らなかったこととしては「アサーションルーレット」がある。これはひとつのテストにたくさんの assertion がある場合、テストに失敗した時どの assertion に失敗しているのかわからない、という問題である。正直、そういうテストコードを目にしたことがあるし、自分もたくさん assertion を並べたことがある…。

これを解決するプラクティスは「One Assertion Per Test 原則」と語られていた。そのまま過ぎるけど、そういうことである。

部分的にペアプログラミングを導入することは難しい

前職の友人と久しぶりに再開した。彼は過去に XP (eXtream Programming) を実践する会社に所属していたこともあり、会ったばかりの頃は XP のプラクティスのひとつであるペアプログラミングを会社に導入したがっていた。僕は彼より先に転職してしまったが、彼は今でも同じ会社に勤め続けている。

「ペアプログラミングは導入できた? “全社的に” とは言わずとも、チーム内とかで」と聞いたら、彼は「この会社でペアプログラミングをするのは諦めた」と言った。なぜなのか。彼が語った話は実に面白かった。内容は次の通りだ。

ペアプログラミングは単にペアでプログラムを書くという行為を指すわけではない。これはコンスタントなコードレビューでもある。つまり、ペアプログラミング中はレビュー目的のプルリクエストは必要ないし、そもそも Git でブランチを切る必要すらない。しかし、会社では main ブランチへの直接のプッシュは禁止されている。プルリクエストでレビューされていないコードをマージすることもできない。つまり、ペアプログラミングを導入するためには開発フロー全体を見直す必要がある。そこまでの労力は割けない。

なるほど、と思った。

僕は知らなかったのだが、これは「トランクベース開発」というものであり、これ自身もよく知られているプラクティスのようだ。

トランクベース開発では (略) マージリクエストの代わりにペアプログラミングやモブプログラミングの仕組みがよく採用されています。これらにおいては、開発期間中、継続的に他者の目でコードの内容が客観的に評価されるため、作業完了時に既に一定の品質が確保されるものと考えられます。

ペアプログラミング (ひいては XP のプラクティス全般) は、ボトムアップで導入する場合でも、開発戦略全体を統括する立場の人間を巻き込まないと実践は難しいのだなあ、と感じた。

風上

あと数年で 40 代に突入する。ありがたいことにソフトウェア開発産業は売り手市場で、40 代でも転職は難しくなさそうだ。「ソフトウェアを開発する仕事」と一口に言っても、その内容は様々である。次に職場を変えるとしたら、どのようなソフトウェア開発をしたいだろう。

僕は「風上に向かいたい」と考えている。

これは上流工程を志向している、という意味ではない。空気は風上から風下に流れるが、そのような流れから逆行したい、ということだ。たとえば、理系の学生が文系に転向することはままあるけれど、文系の学生が理系に転向することは稀である。したがって、理系を志向することは「風上に向かう」ことだと考えている。これは僕が考える風上の定義なので、異論はあるだろう。「僕はそう考えている」という以上の意味はない。

ソフトウェア開発における「風上」とは何だろう。僕は次のように考える。

  • API を使うより、API を作る方が「風上」である
  • ユーザーランドで動作するアプリケーションより、カーネルの方が「風上」である
  • マニフェスト (YAML / JSON) を書くより、マニフェストを読み込むプログラムを書く方が「風上」である

「風上である」ことと「重要である」ことは関係がない。上記のリストは「風上」と「風下」がおおむね対になっていて、両方が存在してはじめて意味を成す (e.g., API を使う / API を作る)。僕は「風上」を志向している、というだけの話である。

意識しないと「風上へ向かう」のは難しい。自分を鼓舞するため、わざわざ記事にしてみた。

2021 年の振り返り

2021 年の出来事を振り返ってみる。 家庭 何よりも大きいのが第二子の誕生である。彼が産まれてから生活は激変した。今回は三ヶ月の育児休暇を取得した (第一子のときは一ヶ月)。 読んだ本 2021 年に読んで印象深かった本を列挙する。 感想をブログ記事にした本 デザインされたギャンブル依存症 ユニコーン企業の秘密 Learn or Die リモートワークの達人 NO HARD WORK! 技術書 達人プログラマー (第二版) 「達人プログラマー」は過去に第一版も読んだ。 第二版は中身が大きく改訂されており、楽しく読めた。 Kubernetes 完全ガイド (第二版) 「Kubernetes 完全ガイド」は通読できていないけど、読んだ部分はかなり丁寧に書かれていて良かった。 漫画本 ムーちゃんと手をつないで 「ムーちゃんと手をつないで」は Kindle で購入して読んだ。 自閉症児の育児について「参考になるな」という気持ちで読んだ部分と、どうにも感情移入してしまって涙ぐんでしまう部分があった。 その他の本 長男のために読んだ絵本の「みえるとか みえないとか」はとても良かった。障害とは何か、幸せとは何か、読みながら考えさせられた。 仕事 職場では主に TypeScript/JavaScript でプログラミングをした。引き続き Individual Contributor として仕事をしている。 大きめの仕事としては AWS を全社的に導入するリードをした。具体的には AWS Organizations を使った AWS アカウントのセットアップや運用ポリシーの設定、IAM や MFA の設定などである。GCP 一辺倒であったところに AWS を導入したけど、それほど混乱なく受け入れられたので、ひとまず成功と言ってよさそうである。 その他、認証基盤の Auth0 マイグレーションや OpenAPI Spec をベースにしたドキュメントの整備などもした。 [Read More]

家計簿作成の自動化スクリプト (ソニー銀行を対象)

前回の記事で次のように書いた。 今は家計簿をつけるためにレシートから CSV ファイルを手入力して支出の管理をしているけど、これは時間の無駄だ。 これを解消する GAS (Google Apps Script) を作成したので、紹介しよう。 僕のメインバンクはソニー銀行である。ソニー銀行のキャッシュカードには Visa デビットカード機能がついている。そして、このデビットカードを使用すると明細がメールで通知される。メール本文には次のような内容が含まれている。 姓 名 さま Sony Bank WALLET(Visaデビット)のご利用がありました。 ・カード利用日: 2021年04月25日 ・ご利用金額(※):1,000円 ・ご利用加盟店:AMAZON CO JP ・承認番号: xxxxxxxx これらを正規表現で抜き出してスプレッドシートに転記できればよい。具体的には次のような GAS を書いた。 var SearchString = "from:banking@sonybank.net Subject:[Sony Bank WALLET ]Visaデビットご利用のお知らせ -label:processed newer_than:1d"; function _createlabel(labelString) { labelDomain = GmailApp.getUserLabelByName(labelString); if (labelDomain === null) { labelDomain = GmailApp.createLabel(labelString); } return labelDomain; } function kakeiboSpreadsheet() { var myThreads = GmailApp. [Read More]

NOT to-do list (および時間を作るための自動化)

息子が生まれてからというもの、時間に追われる生活をしている。昔はテレビゲームをしたり、(漫画) 本を読みふけるなどしたものだが、そういう贅沢は自分にはもうない。…ないんだけど、魔が差してテレビゲームを購入したり漫画を購入したりすると、やはり時間をどんどん溶かせてしまう。その結果、勉強時間と睡眠時間が削られる。

そこで “NOT to-do list” を作ろうかと思う。「自分はこれに時間を費やしていいのか?」と迷うときは NOT to-do list を参照して、迷いなく Yes/No の決断をできるようにしたい。NOT to-do list は時間をかけて項目を考えたいと思う。例として挙げた「テレビゲーム」と「漫画」は最初に入れる。

逆に時間を生み出すものには逆にどんどん投資していきたい。たとえば、今は家計簿をつけるためにレシートから CSV ファイルを手入力して支出の管理をしているけど、これは時間の無駄だ。すべての生活費をクレジットカードで精算して、支払い通知の E メールをトリガーにして Google Apps Script でスプレッドシートに直せば、時間を節約できる。こういうアイディアは昔からあったけど、腰が重くて手をつけられていなかった。しかし、未来の時間のために現在の時間を投資するという観点はやはり重要だ。姿勢をあらためていきたい。