急遽、Node.js 12での作業が必要になったので、Appleシリコン搭載のMac（M1 Max）にNode.js 12.22.12を導入しました。普通に、 nodenv install 12.22.2を実行すると、 BUILD FAILED (OS X 14.3.1 using node-build 4.9.136)と、ビルドがコケてしまうので、 a…

AirPodsの回転角をmyCobotの姿勢と同期。 pic.twitter.com/vNcBK1gYO1— 君塚史高 (@ki_230) 2024年2月1日 AirPods → iPhoneアプリ → Express → python-shell → pymycobot → myCobotと繋いでいって、AirPodsの回転角とmyCobotの姿勢を同期させました。需要が…

前回は、Node.jsからOpen AIのAPIをさささっと叩いてみることを目標に、適当な日本語を返してもらいましたが、今回は画像に写っているものを説明してもらおうと思います。blog.kimizuka.org import OpenAI from 'openai'; const openai = new OpenAI({ apiKe…

Node.jsからOepnAI APIをささっと叩いてみます。 npmにモジュールが公開されているので、ドキュメントのQuickstart通りに進めれば楽々です。github.com https://platform.openai.com/docs/quickstart?context=nodeplatform.openai.comNode.jsとyarnは既に導…

developer.mozilla.orgnavigator.mediaDevices.getUserMediaを使ってカメラに接続しようとする際、 const stream = await navigator.mediaDevices.getUserMedia({ audio: false, video: { deviceId: 'HOGEHOGE' } }); という形でdeviceIdを指定できます。 上…

普段は静的サイトのホスティングに GitHub Pages か Netlify をつかうことが多いのですが、Basic認証をかけたい場合、GitHub Pagesでは実現できないですし、Netlifyでは有料の機能なので、どうしようかなと思っていました。一旦は、 Heroku を使おうかなとも…

先日、AirPodsの回転角を監視するiOSアプリのプロトタイプをReact Nativeで作りました。AirPodsの回転角を監視して、悪い姿勢が続いた際に悲鳴が流れるiOSアプリをつくりました。名付けて「腰の悲鳴」です。 pic.twitter.com/ZqwNDjSRH6— 君塚史高 (@ki_230)…

react-native-soundを使って、iOSアプリでmp3を再生してみます。github.com基本的には、ドキュメント通り進めていけばOKです。github.com アプリの作成 npx react-native@latest init ReactNativeSound react-native-soundの導入 yarn add react-native-soun…

普段、iOSアプリを開発する際はExpoを使っているのですが、Expoには提供されていないモジュールを使用するため、ExpoなしのReact Nativeで実装する機会がありました。いろいろとはまりどころがあったのでセットアップ手順をまとめておきます。 ただ、開発者…

nextjs.org PageRouter const { useRouter } = require('next/router'); export function DetailPageTemplate() { const router = useRouter(); return ( <div> <p>{ router.query.slug }</p> </div> ); } と、PageRouterの時はuseRouterで取得できていた、slugなのですが、App…

developer.mozilla.org配列の中から条件に合う要素を取得する場合、いつも配列をループで回すか、lodashが導入されているプロジェクトでは_.findを使っていたのですが、IE11が亡きいま、Array.prototype.findでいけるということに気がつきました。lodash.com…

以前つくったDEMOをもとに、左上に入力した絵文字を一刀両断するDEMOをつくりました。blog.kimizuka.org DEMO ソースコード（抜粋） 絵文字の判定 document.querySelector('input').addEventListener('input', (evt) => { if (evt.target.value.length === 2…

www.apple.com DEMO 解説 頑張ればひとつのCanvasで描き切れたと思いますし、パフォーマンス的にもそちらの方が良いと思うのですが、 リングを描くCanvas リングの先端を描くCanvas を分けて実装しました。 また、リングの先端の回転はCSSで実装しています。…

typescript-jp.gitbook.ioTypeScriptのenumはJavaScript変換時にオブジェクトに変換されます。 なので、forEachを使って要素を列挙したい場合は、Object.entriesを使えばOKです。developer.mozilla.orgただし、数値列挙型と文字列列挙型のenumで変換されるオ…

Firebaseで匿名認証を作成した際、自動クリーンアップを有効にすれば30日間で匿名ユーザーが削除されるようになります。firebase.google.comしかし、場合によってはスクリプトで匿名ユーザーをまるっと削除したい場合もあるでしょう。 そんなときに使えるス…