ERROR ## There is an issue with node-fibers ##

教材開発は難航しています。
いや，あれこれ手を出しすぎて，難航してしまいました。

Nuxt Type Script で開発している中，どうもコードが煩雑になっている気がして，もっと綺麗に書けないものかな・・・と微妙な雰囲気に。
今にして思えば，ちゃんと仕様書を記録，書いていればそんなことにはならなかったのだろう。

そこで，Canvas ＋ JavaScript で，アニメーション豊かな教材開発をしようとしたのですが，Canvas を使用した場合，要素の判定が非常に面倒くさい！

どれくらいかというと，例えば，画面に表示されている，テンポとか拍とかを変更するために，それらをクリックして変更しようとした際の場合。

（1）まず，テンポとか拍とかを描画した位置情報を変数に格納しておく。
（2）そして，Canvas に対してクリックがある度に，マウスの位置情報を取得して，（1）で格納した変数から，マッチするものがあるかループして探す。
（3）それに応じて，任意の関数を呼び出す。
・・・ここからさらに，変数を設定するコードを用意しなければならない。

めちゃくちゃ面倒。
いま，自分がつくりたい教材には全く向いていない。

Canvas の描画自体はとても素晴らしいです。
HTMLのタグ＋JavaScript ではできないアニメーションを実現してくれます。

が，

これは，ちょっときつい。

ほかに救いがないか，今週は，「Adobe Animate（昔のFlash）」や「Unity」まで手を伸ばしてみました。

結果，それらを習得する時間が足りないので，それも頓挫。

Adobe Animate に関しては，まず日本語資料が少ない。
「Adobe Edge Animate 標準ガイドブック [CC/1.5対応] (DESIGN & WEB TECHNOLOGY) (日本語) 大型本 – 2013/7/20」

これぐらい。しかも，2013年の本で情報は古く，Edge Animate という，Flash と Animate の間にあったソフトウェアの解説本。Edge Animate は，無償でダウンロードできるということが売りでしたが，現在は無情にも「Edge Animate、Edge Inspect、Edge Reflow、および Edge Code。Adobe Edge のすべての製品が Creative Cloud から削除されました。」とのこと。さすが，Adobe。大企業。

Unity に関しては，資料は豊富にあるものの，リファレンスを読む限り，自分が作ろうと思っている教材を作るのはかなり手間そう（どう取りかかって良いか，想像できない）。
例えば，レスポンシブルデザインで出力する方法や，要素の内容を動的に変更したり，追加したり，Javascript と連携したり（これはできそうだったが），それらを習得している時間が足りない。

そして，最終的には，今年の頭に取り入れていた「Nuxt Ts」に戻ることにしようかと，今考えているところです。最悪。

さらに，久しぶり Nuxt TS で作っていたプロジェクトをビルドしたところ，fibers モジュールでエラーが頻発。

ERROR ## There is an issue with node-fibers ##

サーバーが起動しません。

解決方法として，XCode のコマンドラインツールの再インストール（ちょうど，XCode の V.12 がリリースされ，コマンドラインツールもv. 12のGMが配付されていた）。
参考：developer.apple.com

次に，fibersのアンインストールと，再インストール。
これでビルドできました。

参考：「fibers.nodeが見つからないため、流星バンドルが失敗する」

仕様は大きく変わったので，やや1から作り直しに近い部分もありますが，使い回せる部分もあるでしょう。根気強くコーディングしていくのみです。

大会発表まで，あと1ヶ月（切りました）。

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

ただ，Type Script に関する知識はかなり身についたし，最新のJavaScript の動向も追えている。ループ処理もかなり理解したし，Canvas に取り組んでいたことは無駄ではなかったでしょう。あと，エディターとして，Visual Studio 使うようになりました。大変便利。

Canvas で実装していたView の部分を，HTMLのタグで書き出すようにコーディングしなおせば済む（暴論）ことなので，問題はWEB Audio APIの部分ですね。ここをいかにクリアするか！

---