google drive で共有にした音声ファイル mp3 をaudio タグで埋め込むのがうまく行かなくなっていたのを、
iframe タグで成功しました。
以前作ったメロディ付きの無料楽譜サイトが pdf も mp3 もgoogle drive にあるのを src で指定してたのが仕様が変わって使えなくなっていたのでやっと直すことができる。
See the Pen iframe-audio by kalz2q (@kalz2q) on CodePen.
計画
- 前の楽譜サイトは700曲ぐらい入っていた。 このくらいならcodepenで対応可能だと思う。
- とりあえず3曲ぐらいにして、クリックしたら楽譜が表示されて、演奏ボタンが機能するようにする。
- データ移行と言っても多分検索置換で行けると思う、のデータ移行をして700曲で動くようにする。
- 同じやり方でhtmlバージョンも直して動くかどうか。
- reactバージョンをvercelでデプロイする。
前はellieで作って、ellieのサイト、codepenみたいな所で動かしてから、ellieのhtmlバージョンをgithub pagesで公開していました。
今の考えではellieがやろうとしてた事のほとんどがreactとtypescriptとtailwindと言うnext.jsの標準環境で出来てしまうし、ほとんどそのままcodepenでプログラムと実行結果を保存出来るのでそうする。
next.jsのvercelはまだ使っていないけれど、vercelを使えばそのままで公開出来る。
やりたい事(アイデア)とその方法(プログラム)と結果(ホームページ)が明示的に結びつく。
すると、秘密がなくなる。オープンソースになる。
学習効率が上がる。
アイデアが実現して生産性に寄与する。
