CursorによるVibe Codingで『韓国語 Text-to-Speech』ツールを自作してみた

欲しかったツールを雑にCursorで作ったので紹介してみます。

解決したかった問題

市販の韓国語テキストには「QRコードを読み込んで音声を確認」といったものがついているが... QRコード読むのめんどい。 そこでテキストを貼り付けたら発音を教えてくれるツールを作ることに。もちろんGoogle翻訳も似たようなことをしてくれるが、個人的に欲しい機能があったのです。

Google翻訳でも良かったのだが...

欲しかった機能は2つ。

• 再生速度のコントロール（ゆっくり聞きたいときがある）
• （初学者には推奨されないかもだが）読み方をカタカナで表示

開発方針

Cursorでざざっと。デザインは気にしない。ローカルで動かす前提だからセキュリティは最低限、としました。

できたもの

数時間で出来た。Google CloudのText-to-Speech APIで音声変換、OpenAIのAPIでカタカナやら翻訳やらを表示した。APIの取得は自分でする必要があったが、コードはほとんど書いていない。 この規模なら修正ループにハマることなく完成させることができるな、という知見を得た。

指示を出すだけ。良い時代ですね...

デザインはイマイチだが便利...

その他の所感

• 少し前に作ったものだが、便利に使っている。自分で作ったものは愛着が湧きますね。
• デザイン直したらテンションあがりそうだけど、AIが書いたCSSを読むのが面倒でやっていない...。
  • セットアップが面倒なのでしなかったが、React + Tailwindで作ったほうがカスタマイズしやすかったかもしれない。次回やってみたい。