[BMS] 難易度表の相対順位を閲覧するサイトを作りました

BMS

みなさまいかがお過ごしでしょうか。

この頃は自粛要請期間で普段とは異なる環境での生活を余儀なくされている方も多いとは思いますが、そんな中で(自分の周りでの観測上ですが)家にゲームセンターに行けない時間で代わりにBMSに復帰、もしくはさらに没頭している人が増えたようです。

LR2IRで同時接続数が200や300になったという話も聞きます。自分も例に漏れずその一人なのですが。

そんな状況で上がったモチベとGWでさらにできた時間を使って、今回はスコア関連のツールを一つ作りました。 良ければ試してみてください。

https://bms-rankrate-viewer.herokuapp.com/

使い方はシンプルで、LR2IDを入力することで自分のスコアが上位何%かを調べることができます。
スコア力上げの際に、「100位以内で埋めたいけど★1が魔界で...」みたいな悩みを解消できればと思います。
この表では逆にライトプレイヤーが多い有名曲や下位曲が上に着やすいという偏りも出そうですが、普段と違う方向の刺激くらいにとらえていただけると嬉しいです。

今後は
・ソートなど便利機能の追加
・各種難易度表への対応
などを考えています。

そのほかの要望やバグ報告、労いの言葉などがありましたら @sentya7 までお寄せください。お待ちしております。





以下には簡単な開発記を置いておきます。

開発記

ソースはここにあります。

github.com

今回、web開発のようなものが初体験だったのでいろいろと慌てながらやっていましたが、結果として簡易ながらもそれっぽいものができたと思って嬉しく思っています。

用いたものは request/beautifulsoup (データ取得)、flask(サーバー)、heroku(公開) という感じでpython1本です。
基本的に困ったらその都度調べてよっこらせという感じで進めました。特に困ったもの、罠だなあと思ったものなどを以下にメモしておきます。

スクレイピング

日本語が混じっていたので、文字化けに少し苦労しました。
ここに助けてもらいました。

RequestsとBeautiful Soupでのスクレイピング時に文字化けを減らす - orangain flavor

サーバー

flaskは基本的な機能の使い勝手がよく、特に今回くらいのwebサイトをpythonでやるにはうってつけだなあと感じました。 データベースや認証関連の機能は今回使わなかったなので、後々勉強したいなあというところです。

htmlにおける、スコアを表示するテーブルの作成が大変かと思いましたがstairway様のサイトを参考にさせてもらいました。

これは少し別の話ですが、cssを変更した後のテストで、ブラウザが保存したキャッシュを使っているため変更が反映されないという問題がありました。今回はあきらめてキャッシュを削除しながらテストしていましたが、どうにかしたいところです。

CSS

全部です。特に枠の配置が思った通りに行かなくてもどかしい気持ちを味わいました。分からんことばっかりですね。

herokuでの公開

herokuも大変使い勝手がよく、また参考資料も多かったので基本的に詰まることなく作業を進めることができました。 requirementsをきちんと記述すること、htmlやcss(今回jsはなし)ファイルのディレクトリ構成に気を付けることくらいでしょうか。 こちらも込み入った機能はまた機会があれば使いたいと思います。

危険な話

今回実は全然テストを書いていません........ これからも拡張したいのでちゃんとテストをしながらメンテナンスしていきたいと思います。

おわりに

このサイトを作った一番の動機が「俺のモチベを上げる」なので、これから地力/スコア上げしていきたいと思います。