[{"data":1,"prerenderedAt":19},["ShallowReactive",2],{"tag-articles-canvas":3},[4,10,15],{"title":5,"description":6,"path":7,"publishedAt":8,"updatedAt":9},"ステレオサウンドテストページをVue 3/Nuxtで実装 - Web Audio APIによる左右チャンネル出し分け","ReactのJSXで作ったステレオテストページをVue 3 + Nuxtに移植。StereoWaveCanvasコンポーネントの新規作成、Web Audio APIによるL/Rチャンネル分離、Chrome DevTools MCPでの動作確認まで。","/stereo-wave-canvas-vue-2026-02-18","2026-02-18T00:00:00.000Z",null,{"title":11,"description":12,"path":13,"publishedAt":14,"updatedAt":9},"Synthesia風「降ってくる音符」のピアノアプリをWeb Audio + Canvasで作った——実装の詳細メモ","音符バーが上から降ってきて鍵盤に届くと音が鳴るピアノビジュアライザー /piano-roll の実装記録。曲データの持ち方、88鍵レイアウト計算、落下バーの座標系、Web Audioによるピアノ音合成、運指番号表示、楽譜データの入手方法やMIDIキーボード対応の展望まで。","/piano-roll-implementation","2026-06-11T00:00:00.000Z",{"title":16,"description":17,"path":18,"publishedAt":14,"updatedAt":9},"スクショ1枚からSynthesia風ピアノロールWebアプリを作ってもらった日——88鍵Canvas＋Web Audio合成＋運指表示","「ピアノアプリ作ってもらいたいんですけど」と画像1枚を見せたところから、Synthesia風ピアノロール /piano-roll が完成するまでの記録。再生時計が止まる謎、devサーバーの古いコード配信、公開化で見つかったOGメタタグ不足14件の一括修正まで。","/piano-roll-web-app",1785654936564]