Archive

テクミュ(Tec-Mu)の記事

  1. [Javascript] (touchstart | touchend) !== click
    • テクミュ(Tec-Mu)

    AI要約 タッチ操作が可能なデバイスでtouchendイベントを素直に利用すると、スクロール中にもイベントが発生し意図しない挙動を招くことがあります。そのため、より安全なイベントとしてmousedownを使う方法が推奨されます。

  2. [Javascript] タブレット端末などでWebブラウザを落としたかの判別処理
    • テクミュ(Tec-Mu)

    AI要約 タブレット端末や古いブラウザで、スリープや別アプリ遷移時にダウンロードデータが保持されない問題を検証し、復帰時にデータ再読み込みが必要と判明。JavaScriptのsetInterval()を使い、タイマーのズレを検出することでスリープ復帰を判別する方法を紹介する。500ms以上のズレを検知した際に復帰処理を行うサンプルコードも掲載。

  3. [Javascript] iPadとPCのクリック時の挙動の違い
    • テクミュ(Tec-Mu)

    AI要約 JavascriptのaddEventListenerでclickイベントを利用しているが、タブレット(特にiPad)での反応が悪い問題を解説。clickイベントだけではタッチデバイスでの挙動に問題があるため、タッチイベントとの違いを理解し、適切なイベント制御が必要と結論づけている。

  4. Safari で WebAudioAPI を働かせるために無音mp3ファイルを再生する処理をはさむ
    • テクミュ(Tec-Mu)

    AI要約 SafariではWeb Audio APIによる音源再生が、ユーザー操作が明確でないと制限されるため、無音mp3ファイルを事前に再生する処理を挟むことで再生を可能にしました。以前はボタンクリックで直接再生していましたが、現在はタイムライン変数を更新し10ms間隔で再生処理を行う方法に変更。無音mp3再生ボタンを用意することで、Safariの制約を回避し、間接的な音源再生を実現しています。

  5. [WebAudioAPI] localhostで実行時,Safariで音が鳴らない場合
    • テクミュ(Tec-Mu)

    AI要約 Google Chromeでは問題なく動作していたWebAudioAPIを用いた音声再生が、Safariのlocalhost環境で音が鳴らない問題について解説。Safariの設定画面で「自動再生」を「すべてのメディアを自動再生」に変更すると音が鳴ることを確認し、その原因と対策を共有しています。ブラウザ固有のメディア自動再生制限に関する注意点が中心です。

  6. Node.jsを再びいじり出す。
    • テクミュ(Tec-Mu)

    AI要約 今回の記事では、Node.jsを再び扱いながら、《テクミュ》のリファイン作業を進めています。特にユースケース図とクラス図の作成に注力し、理解しやすい設計を心がけています。久しぶりのNode.jsのため苦戦する場面もありますが、継続的に取り組む意欲を示しています。

  7. nginxを用いたリバース・プロキシ
    • テクミュ(Tec-Mu)

    AI要約 複数のNode.js Webアプリケーションを同時に運用するには、同一ポート(80番)の使用ができず管理が煩雑になる。そこでnginxをリバース・プロキシとして設定し、特定のURLからのリクエストを各アプリケーションのポートに振り分ける方法を解説。設定は /etc/nginx/conf.d 以下に.confファイルを作成するだけで簡単に導入可能で、効率的な運用が可能になる。

  8. error: cannot open .git/FETCH_HEAD: ????????
    • テクミュ(Tec-Mu)

    AI要約 久しぶりにサーバーでGit操作中に「error: cannot open .git/FETCH_HEAD」のパーミッションエラーが発生。原因はRoot所有の.gitフォルダ。修正方法としてsudo chownコマンドで.gitフォルダの所有者を自分に変更すると問題が解決した。

  9. "display:flex"は便利(2)
    • テクミュ(Tec-Mu)

    AI要約 本記事では、WebレイアウトにおけるCSSのdisplay:flexの活用について解説しています。具体例として「音の高さ」「音の長さ」を横スクロール可能なグリッド表示に整える方法を紹介し、ボタンの常時表示やflex-growでの柔軟な横幅調整の工夫を述べています。px指定との比較も触れつつ、実際の開発過程を共有しています。

  10. テクミュv2の進捗状況(21年12月第1週)
    • テクミュ(Tec-Mu)

    AI要約 テクミュの改良版(v2)の開発が進行中で、現状の画面イメージや今後の予定について紹介しています。開発を自分で行う難しさや業者に依頼するメリット・デメリット、費用面やコミュニケーションの問題などを率直に述べ、最終的には自作で教材を完成させ公にしたいという意気込みを語っています。

  11. 東京ヤクルトスワローズ,日本一。
    • テクミュ(Tec-Mu)

    AI要約 東京ヤクルトスワローズがサヨナラ勝ちで日本一に輝いた試合の熱気を伝える一方、筆者は広島東洋カープのファンとして来季の展望を思い描いています。また、執筆中の論文結果のドキドキ感や、教材開発のためにUIを大幅改良し、直観的で操作しやすいデザインを模索している取り組みも紹介。スポーツ熱と研究・開発の両面から日常を綴ります。

  12. Bravura(音楽記号)フォントを使う
    • テクミュ(Tec-Mu)

    AI要約 Macで音楽記号フォント「Bravura」を導入し、Wordなどでの利用方法を詳細に解説しています。GitHubからのダウンロード、インストール手順、Unicode16進数入力設定、具体的な楽譜記号の入力方法を画像付きで紹介。GIMPやInkscapeでの活用方法にも触れ、音楽表記のデジタル活用が便利になる内容です。

  13. Let's Encrypt の証明書の更新エラー(CentOS7, Certbot)
    • テクミュ(Tec-Mu)

    AI要約 CentOS7 サーバーで Certbot を使用して Let's Encrypt の SSL 証明書を更新しようとした際、「bad handshake」などの SSL エラーが発生しました。これは 2021年に Let's Encrypt のルート証明書の仕様変更があったことが原因で、古い Certbot では対応できません。解決策としては、EPELリポジトリ経由ではなく、snapd を使って最新の Certbot をインストールする方法が推奨されます。これにより証明書の正常な更新が可能となり、サイト表示も安全な状態に戻りました。

  14. UI/UX は難しい
    • テクミュ(Tec-Mu)

    AI要約 記事では、直感的操作を目指した《テクミュ》のデザイン案検討について紹介しています。Adobe XDなど専用ソフトの利用を検討しつつも、高額な料金設定や分かりにくい公式サイトの日本語表現に疑問を感じています。また、Adobe製品のファイル共有の制約から、より手軽に共有できるPowerPointを使ったデザイン案作成を進めている現状を述べています。

  15. 新年あけましておめでとうございます
    • テクミュ(Tec-Mu)

    AI要約 2021年の新年を迎えましたが、年末から体調不良に悩まされました。微熱が続き、コロナの典型的症状はなかったものの、診療環境の厳しさを実感。車内での簡単な問診のみで薬も処方されず、医療現場の困難さを痛感しました。回復後は研究やテクミュの改良に取り組んでおり、スマートフォンの操作性向上などの改善を進めています。新年の授業準備も控え、今年も気を引き締めて取り組む旨を述べています。

  16. Tec-Mu を更新
    • テクミュ(Tec-Mu)

    AI要約 Tec-Muの発音機能を更新し、これまでChromeとEdgeのみ対応だったのが、iPhoneやiPadのSafariでも動作確認ができるようになりました。しかし、選択肢を表示するダイアログが重く動作を遅くしているため、ユーザー体験改善のためにこの部分の修正を最優先課題としています。特にiPadではダイアログ表示時に音声が停止してしまうという致命的な問題も確認されており、別画面による編集方式への変更を検討中です。発音後の音停止処理の書き忘れもあり、現在修正作業を進めています。

  17. Vue.jsでうまくリアクティブされないからVuexを使った
    • テクミュ(Tec-Mu)

    AI要約 Vue.js(Nuxt)で教材開発を進める中、コンポーネント内の変数変更がリアクティブに反映されず苦労しました。試行錯誤の末、変数をコンポーネントからVuexストアに移して管理することで、描画が正常に更新されるようになりました。特にsetInterval内での変数更新がVueの検知外だったため、Store管理で解決。11月は災難もありましたが、論文執筆に向け前向きに取り組んでいます。

  18. テクミュ(Tec-Mu)の公開
    • テクミュ(Tec-Mu)

    AI要約 新たに音楽づくりWebアプリ「テクミュ(Tec-Mu)」を公開しました。Google ChromeやEdgeで動作確認済みで、バージョンは1.0です。現在、モバイル対応や音声機能の充実など改善点がありますが、随時アップデートと開発メモの公開、将来的なGitHubでのソースコード公開も予定しています。

©Hiroshi Nagayama