随分前になっちゃったけど、音楽アプリを作ってみた

その前から何かしら音楽に関わるwebアプリケーションを作ってみたくて、色々構想を練っていました

希望の要件としては

• ブラウザ上で動かせること
• ログイン不要であること
• 音色をある程度エディットできること
• ビジュアライザー
• デザインはニューモーフィズム（Neumorphism）でやりたい

この辺りを主軸に考え、chatGPTとClaudeに助けを借りながら作りました

主な使用技術は

Next.js/Typescript

Three.js

Web Audio API

スタイリングにはKUMA UIを採用しました

KUMA UIは国産のCSS in JSライブラリでserver componentにも対応しています

styled-components風な書き方もでき、コンポーネントファイル内にスタイル定義を書くことができます、これが自分にとってとても重要です

まだ型の補完が効かなかったりする部分がありますがこれから期待しているライブラリ

これらに加え、

• ダークモードに対応したい
• 音声データを保存し、ダウンロードできるようにしたい

という気持ちもあったので、next-themesを採用、localStorageでは音声データの保存には容量的に耐えられないのでindexDBを扱うためdexie.jsを採用しました

AIに教えてもらいながらいろいろな技術に触れることができました

Three.jsで扱うシェーダは完全にAIに書いてもらいました（全然わからん）

Web Audio APIで音声を生成しているのですが、これもAIの助けなしでは成し遂げられなかったと思います

アプリは以下から触れます

ノイズジェネレーター

マニュアルはヘッダーにあるhelpボタンで見れます

では〜