React 習作第05回ラグマススキルシミュレータβ版

投稿日 2021-03-25

Reactの勉強用に作っているラグマスのスキルシミュレータですが、一応ある程度形になった気がするのでβ版としてみました。気分の問題なので本質的にはほとんど変わってないですけどね。

※β版につき各自の責任でお使いください。

作ってみた感想とか

次回までの課題としていた怪しいクエリーが来た時の処理ですけど、何もいじれていません。そもそもどうしたらヤバいことになるのかがピンと来てないです。超長いクエリーを入れたらオーバーフローとかするのかも知れないな…、くらいのユルい認識です。

とはいえ簡単にバグらせる方法はあってアークビショップで作ったクエリーをソーサラーに読ませるとスキルの値がバグります(逆も然り)。つまり職業チェックをしてないんですね。流石にそれくらいはした方が良いのかも知れませんね。

で、今回の更新点と言えば下記の辺りです。

リセットボタンを新設した
URL出力の出力を素のテキストからinputのtype="url"に変えた
スキルのID表示を消した。それに従って表示も調整した
職業アイコンを付けた(ラグマスファンキットで公開されているモノを使わせて頂きました

基本的にはUIをある程度整えたってくらいです。やはりプログラミングの勉強には何かを作るのが一番ですね。

ToDo

Reactのお作法がまだまだ分かってないので勉強する(最近はHookが流行ってるらしい？
そもそももうちょっとJavaScriptの勉強が足りてないのでは？
いっそTypeScriptでリファクタリングすればTypeScriptの勉強になるのでは？
~~React Routerを使えば職業ごとのページに遷移するのも案外簡単に実装できるかも？~~(廃案予定
合法的に画像が手に入るならスキルアイコンを付けたい
~~アイコンの件と合わせてUI関係の調整をする~~(スキルアイコン以外を調整した
入力データの保存・復元をできるようにする
スキルレベル減少ボタンを付ける(いろいろ面倒な気がするので見ないことにしたい…

まとめ

今回は見た目を結構いじったおかげで体裁が整ったかなと思ったのでβ版にしてみました。けれどまだまだ勉強したいところは多いですね。頑張っていきましょう。感想とか要望とかアイデアとか何かありましたらコンタクトかTwitter辺りに気軽にコメントしてやってください。大変励みになるので、よろしくお願いします。

それでは。