blog
Reactでステートの値が反映されない時に試すこととその理由
ReactのコールバックやuseEffectで、更新したはずのステートの値をちゃんと取得出来ないことがあります。これを回避する方法と、そもそも何故そんなことになるのかという解説です。
Next.jsでWeb VitalsをGoogle Analyticsに記録する
Next.js 9.4から追加されたIntegrated Web Vitals Reportingという機能を使って、LCPやらFIDやらのWeb VitalsをGoogle Analyticsのカスタム速度に記録する方法です。Google Analyticsへの記録にはReact-GAを使っています。
Google AnalyticsでVercel NowのDevelopmentとProductionを区別する
このサイトはGitHubにプッシュするとVercel Nowにデプロイされるようになっています。なので、デバッグ用のデプロイとプロダクションデプロイの二種類があります。この記事は、そんな感じの2種類のサイトから得られるデータを区別する方法です。
Next.js + MDXでブログを作る 〜 Blanktarの場合
このブログはNext.jsとMDXを使って作られています。Next.jsはブログ用というわけではないので、少し工夫が必要な箇所がありました。この記事は、その工夫をまとめたものです。
GitHub ActionsでLighthouseを実行する（treosh/lighthouse-ci-actions@v2使用）
GitHub Actionsを使ってプッシュの度にLighthouseを実行して、WebサイトのSEO対策の状況を自動的にテストしてもらう方法です。テスト結果はActionsのログから見れる他、Artifactとしても保存されます。
Blanktarをリニューアルしました！
2012年に作ったCMSモドキで運用してきたBlanktarですが、いい加減古臭さが目立ってきたので全面リニューアルを行ないました！ モダンな技術を色々取り込んでいます。
Vercel Now（旧ZEIT Now）上でnode-canvasを動かす
Vercel NowにデプロイしたNode.jsのプロジェクトでnode-canvasを使う方法です。node-canvasはpure-jsではないので、依存関係を手動で解決してあげる必要があります。
Gandi.netにクレジットカードを登録しようとしたら「na.gcsip.com」に飛ばされた
ドメインを管理してもらっているGandi.netにクレジットカードを登録しようとしたところ、「na.gcsip.com」というドメインに転送されました。運営者の表記が無くて怪しかったので、少し調べてみました。どうやら、大丈夫なサイトみたいです。
Node.jsで画像に文字を書く
node-canvasというライブラリを使って、Node.jsで画像に日本語の文字を書く方法です。ブラウザのcanvasと同じAPIが実装されてるので、canvasを使ったことがあるなら簡単に使えると思います。
JavaScriptでコールバックな関数をPromise化する
Promiseに対応していなくてコールバック関数を渡さないといけないJavaScriptの関数を、async/awaitで呼び出せるようにPromise化する方法です。