半年ぐらい新アーキで簡素な UI で作りつつ、時折ないと不便だと感じた機能だけ移植しながら自分だけで使ってきました。UI を Vuetify にして、ベータ版を Pre-release で出してましたが、もういいかなってことで正式リリースしました。
技術的な詳細はこちらに書きました。
v3.0.0 としてリリースして、直後にバグフィックスして v3.0.1 をリリース。
かなりシンプルなアプリになった気がします。
2022 4-6月の会社テックサイトへの投稿記事
7月になったので、1Q の会社テックサイトへの投稿記事をレビューしたいと思います。
サイトの機能追加のおかげで、執筆者別の記事リストが見えるようになりました。
4月
Apple Silicon 対応の Electron バイナリを作る方法を知らなかったので、ちょうど使い始めた M1 MacBook Pro で試して書いた記事です。結果、electron-builder を使うとバイナリやインストーラは、Intel Mac でも M1 Mac でも作れるし、Universal バイナリにすれば、どちらのアーキテクチャでも動くということがわかりました。
複数のジョブから構成される GitHub Actions ワークフローの実行で、失敗したジョブだけリランする機能について紹介しました。長い長いパイプラインの最後の最後で失敗して徹夜みたいなことがよくあったので、この機能はもっと早く欲しかった。
Minikube でプロファイルを切り替える時の config との関係がちょっとわかりづらかったので tips 的な記事にしました。
Docker 開発者によるポータブルな CI 構築ツール Dagger が話題だったので試して記事にしてみました。
5月
Gitpod が IntelliJ IDEA のリモート開発環境をリリースしたというブログを読んだので試してみた内容を記事にしました。
GitHub Actions ワークフロー実行時に作成される Summary ページに情報を付加できるジョブサマリー機能を紹介しました。
GitHub Codespaces のベータテストが僕のアカウントで解放されたので試用レポートを書きました。
Kafka のようにステートフルな分散システムは Kubernetes での運用が難しいですが、これをかなり簡単にしてくれる Operator Strimzi について、導入から通常運用まで詳しめの記事にしました。
6月
Electron のテストフレームワーク Spectron が discon になってどうしようかと思ってたら Playwright が対応してきてたので使ってみた記事です。ただ、Electron のサポートはまだ実験的段階で、GitHub Actions のワークフローで使ってみても大体タイムアウトでエラーになるので、しばらく静観します。
3月に書いた再利用可能ワークフローの続編で、再利用可能ワークフローとマニュアルトリガーワークフローの入力値取得が統一され便利になった話を記事にしました。
GitHub の Dependabot にライブラリのアップデートの Pull Request も作ってもらって更新をタイムリーに行う方法について紹介しました。
GitHub のセキュリティ脆弱性スキャンの機能の紹介をしました。そこで使われている静的コード分析の言語 CodeQL が面白かったので記事にしたものです。
M1 Mac で Minikube は、まだ Hyperkit が未対応で実質使えないですが、QEMU ドライバーに対応したリリースが出たので試してみました。結果、まだダメだったという人柱系記事です。
同僚の人のリクエストで書いたのですが、PR のレビューについて、インラインコメントの conversation をちゃんと使おうねという記事でした。
会社ブログでも1Qのふりかえり記事を投稿してます。
この四半期の記事は GitHub の新機能の紹介が多めでした。記事のネタを探して GitHub の ChangeLog を購読してたりします。PR レビューの機能はみんなが知ってると効率も品質も上がるので記事にする価値があると思いました。
けっこうなペースで記事を書いてるのでネタに困ることもありますが、テックブログなどで情報を得て、試してみてインプレッションを書くというのが割と自分に合ってる(というかテーマ性のある連載などができない)というのもあり、しばらくこういうスタイルで続けてみようかと思っています。
Google Analytics 4 への移行作業
会社テックブログの Google Analytics 見てると「エンゲージメント-ページとスクリーン」などのいい感じのレポートあるなあと思って、自分のブログのレポート見るとそんなのない。もう GA4 という新しい Analytics がローンチされて、既存の UA-XXXXX のトラッキング ID を使用しているプロパティはそのうち使えなくなるというのを知りました。
はてなブログはまだ GA4 に正式対応してなかったので、設定の <head>要素にメタデータを追加 のところでこんなグローバルサイトタグを追加しました。
<!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-XXXXXXXXXX'); </script>
そしてつい先日、はてなブログが GA4 に対応したアナウンスがありました。
グローバルサイトタグのままでもいいのかもしれませんが、公式の設定の方がいいに違いないと思って早速設定。
旧トラッキング ID もまだ残してます。ブログはこれで移行完了。
kondoumh.com のホームページは、Hugo で作っています。
旧 GA は Hugo の config.toml で UA-XXX のトラッキング ID を設定するだけで簡単でした。移行してから一度も Hugo のバージョンアップをしておらずかなり古いバージョンを使っているのですが、この辺の issue を見ると最新版でも GA4 にはまだ対応していないっぽいです。
ただ自前でグローバルサイトタグを head に埋め込めばいけるはずということで、使ってるテーマ Ananke のテンプレートをいじりました。
layouts/partials/analytics.html にグローバルサイトタグのテンプレートを追加。config.toml から読み込んだ G-XXX の ID を展開するように設定。
{{ if not .Site.IsServer }}
{{ with .Site.GoogleAnalytics }}
<!-- Global site tag (gtag.js) - Google Analytics 4-->
<script async src="https://www.googletagmanager.com/gtag/js?id={{ . }}"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '{{ . }}');
</script>
{{ end }}
{{ end }}
config.toml では G-XXX の ID を指定します。
googleAnalytics = "G-XXXXXXXXXX"
Ananke は layouts/_default/baseof.html で _internal/google_analytics_async.html を呼び出していてこれが GA4 に対応していない模様。
hugo/google_analytics_async.html at master · gohugoio/hugo · GitHub
ということで、この呼び出しを追加した analytics.html に置き換えます。
- {{ template "_internal/google_analytics_async.html" . }} + {{- partial "analytics" . -}}
これで、サイトをビルド・デプロイするとヘッダーにグローバルサイトタグの JavaScript が埋め込まれました。
以上でブログとホームページの GA4 への移行作業が完了しました。
2022 1-3月の会社テックサイトへの投稿記事
昨年12月にローンチした豆蔵デベロッパーサイト。社内有志で記事投稿しています。
4ヶ月間の活動ふりかえりブログ書きました。
この個人ブログでは今年に入って3月末までの四半期で僕が投稿した記事をふりかえってみます。
1月
けっこう長いこと使ってきたのに Electron BrowserView まったく知りませんでした。記事書いて勉強したので Scrapbox アプリを WebView から BrowserView に移行する作業を隙間時間にやっています。
野良 Scarpbox アプリ - アーキテクチャ見直しドッグフーディング - kondoumh のブログ
かなり前に Go で書いた Scrapbox -> Markdown 変換ツールの軽い記事。デベロッパーサイトにも Scrapbox の記事が増えたのでタグを追加してます。
2月
BrowserView の勉強で Electron プログラミングのお作法がかなり変わってるなあと感じたので、公式リファレンスアプリのコミット履歴からその変遷を書いてみました。この時は Mermaid ブーム来てなかったので図は draw.io で描いてます。
昨年使い始めた Slidev のことを書いたツール紹介記事です。サンプルで作ったスライドのネタは一つ前の Electron 公式リファレンスアプリの文章を流用しました。コードのハイライトではクリック回数を指定してコード上のフォーカスを移動するという凝った演出ができます。
CI 関連のネタとして、過去にこのブログで書いた記事を再編して投稿してみました。直前に Mermaid プラグインが使えるようになり、まさにうってつけでした。
最近使ってる Debezium について書きました。あまり調べきれてなくてこの記事書きながら知ったこととかもありました。知ってることを纏めるのも知識を整理するよい機会だと改めて思った次第です。
3月
Publickey の記事読んで Tauri の存在を知り、ちょっと触ってみて書きました。Publickey の波に乗ってけっこうはてブがついてますね。
GitHub Actions のワークフロー再利用機能を使ってみて書きました。ナイトリービルドとリリースでブランチが違うだけでほとんどコピペで書いてるとか多いので、よい機能だと思います。
リリースノート自動生成機能を試した記事。1年前にこのブログで取り上げた Release Drafter と同様の機能です。
GitHub リリースページのドラフトを自動生成してくれる Release Drafter を導入する - kondoumh のブログ
Wasm 関連はたまにウォッチしていますが、そろそろ PoC 案件とかに登場するフェーズになってるのかなあと。
Issue と PR の紐付けは忘れがちなので自動的にできるのはよい機能だと思いました。
以上、3ヶ月で11本書きました (冒頭のふりかえりブログ除く)。
GitHub 関連の記事4本入りました。これまで個人ブログの CI タグで色々GitHub Actions の機能について書いてきましたが、GitHub ウォッチャー的な記事を会社ブログの方に書いていこうかなと思ってます。今のところ連載を持つようなネタはないので単発ブログばかりです。
技術ネタはデベロッパーサイト優先にするため、個人ブログの投稿は減ってますが、四半期毎ぐらいにこんな感じで投稿した記事のレビューを書こうかなと思っています。
Mac のユニバーサルコントロールで Magic な入力機器に回帰
macOS Monterey 12.3 と iPadOS 15.4 がリリースされ、1台の Mac で iPad や他の Mac をシームレスにコントロールできるユニバーサルコントロール機能が解除されました(ただしベータ版)。さっそく macOS と iPadOS をアップデートして導入してみました。
先日 iPad を Sidecar で第3のディスプレイにしたところでした。
Sidecar とユニバーサルコントロールは共存できるっぽいんですが、画面とユニバーサルコントロールの対象デバイスは別物と認識されるようで、使ってる間にどちらかが解除されたり、Sidecar が有効だとユニバーサルコントロール対象デバイスの位置調整が思うようにできなかったりします。ベータ版だからでしょうか。
Sidecar はすばらしい機能ですが、iPad アプリとの切り替えは画面に手をのばしてスワイプする必要があり、やや煩雑です。ということで Sidecar による画面拡張は廃止して、ユニバーサルコントロールだけを使う運用にしました。安定して使えています。
ユニバーサルコントロールは、物理キーボードや Trackpad を iPad にペアリングしてるのとほぼ同じ感覚で使えてかなり快適です。今のところ iPad 側にカーソルを移動しただけではキーボードのコントロールが切り替わらなくて、1度クリックというかタップしないといけないのがちょっと微妙なので正式版での改善を期待しています。
去年11月に REALFORCE をリニューアルしたところですが、ユニバーサルコントロールだと iPad では US キーボードと認識されてしまうのと、机が狭くなっちゃってるので Apple Magic Keyboard を復活させました*1。Magic Keyboard は常用してると指先が痛くなるので3年前に iPad 用にしてたのを再び MacBook とペアリング。
タッチは REALFORCE の方が圧倒的によいですが、やはりコンパクトで USB ケーブルも使わないのでスッキリします。Karabiner-Elements などサードパーティのドライバーも不要。マウスも Windows 用エルゴノマウス使ってたのを Magic Trackpad に戻しました。当然 MacBook との相性は完璧でスクロールもスムーズ。Magic Trackpad だけだとドロー系ツールで図を書くときなど厳しいので Magic Mouse で補ってます。再利用なので余分な出費も不要です。
ということで、ユニバーサルコントロールを Apple の周辺機器だけで使うのはとても快適です。純正周辺機器は正義、ワイヤレスは正義、という思いに至りました。副作用として時々 MacBook の画面を指でタッチしそうになる問題が。あと指先痛い問題が懸念ですが極力ソフトタッチでタイプするよう心がけてます。Magic Keyboad の荷重はやや重めなので MacBook Pro 本体ぐらいの柔らかタッチ Magic Keyboard の登場が待たれます。
*1:最初 MacBook 本体のキーボードと Trackpad 使ったらいいじゃんと思って試したのですが、パームレスト部分の熱がじわじわきて低温やけどになりそうなのでやめました。
Sidecar で iPad を第3のディスプレイ + Touch Bar にする
M1 Pro MacBook Pro 14 (2021) を業務用に調達しました。
ということで 私物 MacBook Pro 13 (2015) ではできなかった Sidecar で iPad を外部ディスプレイにするのをやってみました。
事前に iPad と MacBook の双方で iCloud を使用して 2FA を有効化しておく必要があります。USB-C ケーブルで、MacBook - iPad を接続。iPad は 27 インチディスプレイとキーボードの間に配置しました。
これまでは、ターミナルのちょっとした作業を右サイドの MacBook 本体のディスプレイでやっていたのですが、iPad 側にターミナルを置いて使っています。やはり正面の方が作業がやりやすいです。時々 Finder でファイルを探したりするのも iPad 画面でやるようになりました。
Sidecar では Touch Bar の機能が発動するため、ちょうどキーボードの上部の Touch Bar 的なポジションで使用可能です *1。
Sidecar ネットワーク接続もできるようですが、ケーブル接続なので遅延も少なく Apple 標準機能なので設定も簡単で非常に安定しています。Duet Display のようなオーバーヘッドもありません。
この時は、iPad を Windows の外部ディスプレイにしてましたが、結局ポータブルディスプレイを導入してしまいました。
在宅ワーク環境はディスプレイだらけになりましたが、どの画面で何の作業をするかが固定されて、アプリの切り替えがほぼ無くなり混乱することが減ってよかったです。
*1:ほとんど使うことはなく廃止されたのは納得です。
Electron の記事執筆とスライド作成
豆蔵デベロッパーサイトにまた Electron の記事を投稿しました。
同様の内容を Slidev を使ってスライドにしました。Netlify に簡単に publish できるのでしました。
https://history-of-electron-quick-start.netlify.app
Slidev は 1スライド1 SPA サイトな感じですね。
それをまた記事にしました。