【クソアプリ】キーボードが操作できないページを作った

アプリ本体

これ

使用技術

使い慣れているということでnext.jsを使用しました。技術の無駄遣い ビルド先もいつも通りgithub pagesを使用しました。

コード部分

1document.addEventListener("keydown",(e)=>{e.preventDefault()})

やっていることは、keydownイベントが発生したらそれをキャンセルしているだけです。

ただし、これではタブで開いているときに特定のイベント(例えばctrl+wなど)が取れなかったのでそれらを取るためだけにPWA化しました。

これをclientサイドで実行するためuseEffectで囲みました。(本来この使い方はすべきでないかもしれないがクソアプリなので...)