Blanktar

  1. top
  2. blog
  3. 2020

2020年5月の記事

  1. Next.jsでWeb VitalsをGoogle Analyticsに記録する

    Next.js 9.4から追加されたIntegrated Web Vitals Reportingという機能を使って、LCPやらFIDやらのWeb VitalsをGoogle Analyticsのカスタム速度に記録する方法です。Google Analyticsへの記録にはReact-GAを使っています。

  2. Google AnalyticsでVercel NowのDevelopmentとProductionを区別する

    このサイトはGitHubにプッシュするとVercel Nowにデプロイされるようになっています。なので、デバッグ用のデプロイとプロダクションデプロイの二種類があります。この記事は、そんな感じの2種類のサイトから得られるデータを区別する方法です。

  3. Next.js + MDXでブログを作る 〜 Blanktarの場合

    このブログはNext.jsとMDXを使って作られています。Next.jsはブログ用というわけではないので、少し工夫が必要な箇所がありました。この記事は、その工夫をまとめたものです。

  4. GitHub ActionsでLighthouseを実行する（treosh/lighthouse-ci-actions@v2使用）

    GitHub Actionsを使ってプッシュの度にLighthouseを実行して、WebサイトのSEO対策の状況を自動的にテストしてもらう方法です。テスト結果はActionsのログから見れる他、Artifactとしても保存されます。

  5. Blanktarをリニューアルしました！

    2012年に作ったCMSモドキで運用してきたBlanktarですが、いい加減古臭さが目立ってきたので全面リニューアルを行ないました！ モダンな技術を色々取り込んでいます。

  6. Vercel Now（旧ZEIT Now）上でnode-canvasを動かす

    Vercel NowにデプロイしたNode.jsのプロジェクトでnode-canvasを使う方法です。node-canvasはpure-jsではないので、依存関係を手動で解決してあげる必要があります。

  7. Gandi.netにクレジットカードを登録しようとしたら「na.gcsip.com」に飛ばされた

    ドメインを管理してもらっているGandi.netにクレジットカードを登録しようとしたところ、「na.gcsip.com」というドメインに転送されました。運営者の表記が無くて怪しかったので、少し調べてみました。どうやら、大丈夫なサイトみたいです。

  8. Node.jsで画像に文字を書く

    node-canvasというライブラリを使って、Node.jsで画像に日本語の文字を書く方法です。ブラウザのcanvasと同じAPIが実装されてるので、canvasを使ったことがあるなら簡単に使えると思います。