2024-03-01から1ヶ月間の記事一覧
抽選した数字を表示する前にランダムを抽選した数字をぱららららっと表示する仕組みを作りました。 ライブラリ不要でさささっと使うためにVanilla JSで書いています。 DEMO See the Pen random by kimmy (@kimmy) on CodePen. ソースコード index.js const p…
昔、CodePenにアップした、干渉縞を鑑賞するサイトをリメイクしました。 See the Pen moiré by kimmy (@kimmy) on CodePen.CodePenでは、base64化した画像を背景画像にしたDOMを回転させていましたが、今回はCanvasで制作したので、動的にパラメータを変更で…
結論 「Project Setting > Deployment Protection > Vercel Authentication」をDisabledに設定すればOKです。 ことの発端 普通はこんな使い方しないと思うのですが、LINE BotのWebHookに使うためのAPIをVercelにデプロイした際に気がつきました。blog.kimizu…
前回は、LINEBot用のスクリプトを作成しましたが、その際はNgrokをつかって公開し、動作を確認しました。blog.kimizuka.orgblog.kimizuka.orgblog.kimizuka.orgしかし、実際に永続的に運用していこうとなると、APIとしてどこかしらで動かし続けた方がよさそ…
以前、LINEBot用のスクリプトを作成しましたが、その際はNgrokをつかって公開し、動作を確認しました。blog.kimizuka.orgblog.kimizuka.orgblog.kimizuka.orgしかし、実際に永続的に運用していこうとなると、APIとしてどこかしらで動かし続けた方がよさそう…
結論 const { app } = require('electron'); const window = new BrowserWindow({ width: 375, height: 812, webPreferences: { devTools: false } }); と、BrowserWindowのインスタンスを作成する際に渡すオプションでディベロッパーツールを無効化できる。…
Vercelが @next/third-parties というライブラリを提供してくれているので、それを使えばGA4の導入も楽々です。www.npmjs.com@next/third-parties はGoogle Tag Managerにも対応しているのですが、今回はGA4を直接導入します。 ソースコード(抜粋) src/app…
Next.js(App Router)で作成したポートフォリオサイトにRSSフィードを実装してみました。https://kimizuka.fm/rss.xmlキャッシュの設定が適切にできているかに不安が残りますが、実装方法をメモしておきます。 今回はサイトをデプロイするたびに、ルート直…
まず、ドキュメントを読むとすべてが書いてあります。 書いてあるのですが、プレビュー環境と本番環境でrobots.txtを出し分けたかったので、色々検証してみました。nextjs.orgまずは、ほぼほぼドキュメント通りの実装。 app/robots.ts import { MetadataRout…
赤外線カメラで再規制反射材を撮影して、再帰性反射材をトラッキングすることを目指しました。まず、こちらが赤外線カメラの前で再規制反射テープを振り回している映像です。 今回は、こちらの映像をCanvasにレンダリングした後、OpenCV.jsを使って、❶ 二極…