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

Reactの勉強をするためにスキルシミュレータを作っている近頃ですけど、更にいろいろ改良などしたおかげで職業別に作ることが可能なくらいまでソースの一般化が進みました。その一例としてソーサラーのスキルシミュレータを作ってみました。

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

作ってみた感想とか

import, exportを使えば変数とかを他ファイルから読み込むの楽勝でした。オレのJavaScriptのレベルが低いだけでした。頑張りましょう。

コアプログラムのハードコーディングな部分はかなり減ったのでReact Routerと合わせればソースの共用ができるようになり更新が楽になりますね。今はまだディレクトリごとコピーして別の名前にしてビルドなので、根幹部分のソースを変えたら全てのディレクトリにコピーして作り直しです。ダサダサなのでスマートにしていきたいですね。

ついでにReact Routerを使うことによってURLからのデータの読み込みが楽にできるはずなのでここら辺も詰めていきたいです。

ToDo

  • Reactのお作法がまだまだ分かってないので勉強する
  • そもそももうちょっとJavaScriptの勉強が足りてないのでは?
  • Reactのチュートリアルで最初から入ってる要素をカスタマイズしたい(faviconとか
  • React Routerを使えば職業ごとのページに遷移するのも案外簡単に実装できるかも?(その実験のために2職分の画面を作った
  • 合法的に画像が手に入るならスキルアイコンを付けたい
  • アイコンの件と合わせてUI関係の調整をする(無いなら無いなりの表示に
  • 入力データの保存・復元をできるようにする
  • 入力データのURL出力・入力をできるようにする
  • スキルレベル減少ボタンを付ける(要るよね…

まとめ

というわけで、少しずつですが習作を進めております。感想とか要望とかアイデアとか何かありましたらコンタクトTwitter辺りに気軽にコメントしてやってください。大変励みになるので、よろしくお願いします。

それでは。