みかづきブログ・カスタム

基本的にはちょちょいのほいです。

PCにオーディオインターフェイス(SERIES 208i)を繋いで、ブラウザから5つのスピーカに対して音源を再生する 📢

blog.kimizuka.org4チャンネルの音源再生がうまくいったので、1チャンネル増やすのなど簡単なことであろうと思っていたのですが、がっつりハマりました。 今後のためにメモを残しておきます。 結論 こちらで、5つのモノラル音源(440Hzのサイン波)を5つのス…

Windows機にオーディオインターフェイス(SERIES 208i)を繋いでブラウザから4チャンネルの音源を再生する 📢

ひさしぶりに、Windowsでオーディオインターフェイス(UR44CR)を使おうとしたら、使い方をすっかり忘れ、わたわたしてしまったため、今後そうならないようにメモを残しておきます。www.steinberg.netただ、調査の結果、UR44CRはWindowsではASIO対応のソフト…

Node.jsからVertexAI APIをさささっと叩く 🔨

かつて、Node.jsからOpenAI APIをささっと叩いたことがありましたが、今回はVertexAI APIをさささっと叩いてみようと思います。blog.kimizuka.org公式の クイックスタート はこちらです。cloud.google.com ❶ 必要なモジュールをインストールする yarn add @g…

Shopifyのカート操作やチェックアウトの実装方法を、Shopify JavaScript Buy SDK(shopify-buy)から、Storefront API Client(storefront-api-client)に乗り換える 🛒

これまで、Shopify JavaScript Buy SDKを使ってShopifyのカート操作やチェックアウトを実装していたのですが、2025年1月に廃止になってしまいました。 Deprecation notice Note: The JS Buy SDK is deprecated as of January, 2025. It will no longer be up…

Mac(OS 15.3)にオーディオインターフェイス(UR44C)を繋いでブラウザから4chの音源を再生する 🔈

Mac

ひさしぶりに、オーディオインターフェイス(UR44CR)を使おうとしたら、使い方をすっかり忘れてしまっていたので、今後のためにメモを残しておきます。 以前作った、4chの音源を再生するウェブサイトを使って検証します。https://web-audio-api-4ch.netlify…

pyenvを使ってMacでpyhonのバージョン管理をする 💻

Mac

Macにバージョン違いのpyhonをいくつかインストールしたかったので、anyenvとpyenvを使うことにしました。 導入手順をメモしておきます。 導入手順 anyenvのインストール README の通りに進めれば導入できます。 brew install anyenvanyenv initecho 'eval "…

ASARアーカイブの中身をさささっと確認する 👀

結論 例えば、app.asarに収納されているファイル一覧は、 npx asar l app.asar で確認できます。 ASARアーカイブとは Asar is a simple extensive archive format, it works like tar that concatenates all files together without compression, while havi…

Electronでメインプロセスとレンダラープロセスで通信を行う ⚡️

一昔前は、何も考えずに ipcMain と ipcRenderer でやり取りを行なっていたのですが、最近は contextBridge を挟むのがセオリーとなってます。www.electronjs.org レンダラープロセス → メインプロセス 例として、レンダラープロセスからアプリの終了を行な…

rubyタグを使ってHTMLにルビを振る 📝

ルビ注釈要素の存在は知っていましたが、しっかり使ったことがなかったので、仕様を調べてみました。developer.mozilla.org DEMO ソースコード index.html <ruby> 君塚 <rp>(</rp> <rt>きみづか</rt> <rp>)</rp> 史高 <rp>(</rp> <rt>ふみたか</rt> <rp>)</rp> </ruby> こちらの 拡張 で読み上げ時の挙動も確認してみましたが、rt…

どんなサイズになっても両端が半円のボタンをつくる 🔘

CSS

基本的にborder-radiusを短辺の半分を指定すればOKですが、変数を使わないと、ボタンのサイズが変更になるたびに再設定が必要となります。 そんなとき、 border-radius: 9999px; や、 border-radius: 100vmax; など、border-radiusに大きな値を入れればボタ…

AWS CodeCommitのリポジトリをSourcetreeで管理する ☁️

Mac

CodeCommitのリポジトリをSourcetreeで管理するまでの手順をメモしておきます。 ❶ Git 認証情報を使用して HTTPS ユーザーのセットアップを行う docs.aws.amazon.comまずは公式のユーザーガイドに従ってリポジトリをローカルにクローンします。 ❷ Sourcetree…

SurfaceをローカルアカウントでセットアップしてMicrosoftアカウント無しで使用する 🪟

support.microsoft.com一昔前はオフラインでセットアップすることで簡単にローカルアカウントを作成することができたのですが、つい先日セットアップした際、一筋縄でいかなかったので、手順をメモしておきます。 環境 デバイス: Surface Go4 OS: Windows 11…

autocomplete属性を使って、フォームの自動補完を無効にする 💻

developer.mozilla.orgなんと、現代的なブラウザーの多くはログイン欄における autocomplete="off" に対応していないようです。 現代的なブラウザーでは、パスワードを一括管理する機能が実装されています。ユーザーがウェブサイトでユーザー名とパスワード…

Macにffmpegをインストールして動画や音声を自在に変換する 🎥

Mac

導入方法 XCodeのコマンドラインツールをインストール xcode-select --install Homebrewをインストール /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"公式サイトにインストールコマンドが記載されてい…

osc.jsを使ってZIG SIMからOSCで送られてくるセンサ値を受け取る 📱

www.npmjs.comZIG SIMから送られてくる値は、ZIG indicatorで確認したいところですが、残念ながらOSCを受け取ることはできないので、Node.jsを書いて、さささっとターミナル上で確認します。zig-project.com ソースコード package.json { "name": "osc-devel…