2024-07-01から1ヶ月間の記事一覧
最近、Blenderで3Dプリント用のstlファイルをせっせと制作しています。こんな感じで、toio用の治具を作ってみたり、こんな感じで、ATOM Matrixを腕時計のように装着できる治具を作ってみたりと、大活躍中です。Blenderも3Dプリンタも。さて、今回はBlenderで…
タイトルの通りですが、Macでelectron-builderで書き出したアプリを開こうとすると「壊れているため開けません。ゴミ箱に入れる必要があります。」と表示される際は拡張属性を削除すると開けるようになります。 xattr -rc アプリ名でOKです。
こちらの記事のES Modulesバージョンです。 ※ Node.js v20.10.0、yarn 1.22.22 で作成blog.kimizuka.org 必要なパッケージをインストール yarn add express socket.io app.mjsを作成 import { createServer } from 'node:http'; import path from 'node:path…
direnvを使うと、ディレクトリごとに環境変数を切り替えられるようになります。 brewを使ってインストール brew install direnv ~/.zshrcに追記 ~/.zshrc eval "$(direnv hook zsh)"ここで、 export EDITOR=vimという具合にエディタも記載しておくと、 diren…
text-align: justify developer.mozilla.orgテキストを両端揃えにします。 厳密に言えば文字詰めとは別の処理なのですが、結果的に文字間が調整されます。 font-feature-settings: 'palt' developer.mozilla.orgOpenTypeのプロポーショナルメトリクスを有効…
前回はReactで等速で往復運動するコンポーネントを作りました。blog.kimizuka.orgこのコンポーネントを複数設置すればインベーダーゲームのような動きが作れると思い、試してみたのですが。※ クリックすると動き出します何かが違う。公式サイトを観察してみ…
タイトルの通りですが、ES Moduleで__diranameを使う方法です。例えば、index.jsや、index.cjsに、 console.log(__dirname); と記述し、 node index.jsnode index.cjsを実行すると、ディレクトリまでのパスが表示されますが、index.mjsに、 console.log(__di…
Cubeがクリックされたことを検知 HTTPリクエスト（GET）でJSONの取得 HTTPリクエスト（POST）でJSONの送信 WebSocketによる通信 今回はここ blog.kimizuka.orgblog.kimizuka.orgblog.kimizuka.org今回のモックを作りたくて色々と記事を書いてきましたが、直…
Cubeがクリックされたことを検知 HTTPリクエスト（GET）でJSONの取得 HTTPリクエスト（POST）でJSONの送信 今回はここ WebSocketによる通信 前々回、前回の続きです。 今回はCubeがクリックされた際に、HTTPリクエスト（POST）でJSONを送信します。 開発環…
Cubeがクリックされたことを検知 HTTPリクエスト（GET）でJSONの取得 今回はここ HTTPリクエスト（POST）でJSONの送信 WebSocketによる通信 前回の続きです。 今回はCubeがクリックされた際に、HTTPリクエスト（GET）でJSONを取得します。 Unityアプリに加…
ものすごく久しぶりにUnityを使い、サーバと通信するモックを作成しました。 Cubeをクリックしたことをサーバに送信したり、サーバからJSONをGETしたり、WebSocketでブラウザとメッセージのやりとりをするモックです。実装時に、何もかも忘れていたので、忘…
OpenCV.jsでカメラで撮影した映像内の赤色の割合を検出し、早押しボタンが押されたことを検知するプログラムを作ってみました。 部屋の明るさや、日光の入り方などに依存しますが、なかなかの精度が出ています。 ソースコード index.html <html> <head> <meta charset="UTF-8" /> <title>OpenCV - Quiz</title> </meta></head></html>
developer.mozilla.orgMouseEvent.buttonとMouseEvent.movementX・MouseEvent.movementYを使うと、ものすごく簡単に要素をドラッグ可能にすることができることを教わりました。 MouseEvent.buttonを使っているのでスマホをはじめとするタッチデバイスでは動…
改行タグとdangerouslySetInnerHTMLを使う方法 ソースコード DEMO 改行コードとwhite-space: pre-wrapを使う方法 ソースコード DEMO 改行タグとChildrenを使う方法 ソースコード DEMO 改行タグとdangerouslySetInnerHTMLを使う方法、改行コードとwhite-space…
こちらでの対策でpackage.jsonに己のリポジトリを指定しましたが、もう少し深掘りします。blog.kimizuka.orgnpmのドキュメントに、もろもろ記載されています。docs.npmjs.com リポジトリのURLとブランチ名を指定 { "dependencies": { "electron-next": "git+…
ひょんなことからFirmataとJohnny-fiveで行うような処理を自作したという話です。www.arduino.cc johnny-five.ioMacに接続したArduinoに対して、ピン番号と0〜255の値をシリアル通信で送ることで、Arduinoがその通りに出力します。以前つくった、ディマーをO…
