今乗っている路線をなめらかに表示させる

作ったもの

Near Station

ソース

GitHub - Goryudyuma/location2

動機

前に同じようなの作ってて、でも満足はしてなくて、その後某駅○モにも前作と似たような実装で表示されるようなやつができたとの話を聞いたので、じゃあ僕はもっとなめらかなすごいやつ作ってやるぞ!ってなって今作を作った。(たぶんn番煎じ)

使った技術

ubuntu+さくらVPS+NGINX+PHP7+MySQL5.7+React.js+bootstrap

ubuntu

雑魚なのでまともに触れるのubuntuだけ・・・

さくらVPS

前に使ってたVPSより性能高くて反応もよくて非常に満足。ただし高い。

NGINX

配信用。Let's Encryptも使ってHTTPSとHTTP2の対応。ついでにIPv6も対応させた。

letsencrypt.org

qiita.com

PHP7

APIスクリプト。適当に書くだけで動くから好き。PHP5でもたぶん動くけどPHP7にしたのは趣味。

MySQL5.7

位置情報とか駅情報などを入れてるDB。MySQL5.6から導入されたgeolocation型や、MySQL5.7から導入されたJSON関数などを使用している。

React.js

JSの先生に勧められるがまま勉強したフレームワーク。時々詰まることもあったけど、日本語資料が多く調べやすかった(たまに英語資料だがわかりやすい)。画面更新処理などがとても書きやすい(、けどJSのフレームワークこれくらいしかしらないので、もっと書きやすいやつは探せばあるのかも?)。日本語チュートリアルや、koba04氏の一人React.js Advent Calendarがとても参考になった。

qiita.com

bootstrap

Viewを整えるやつ。React-Bootstrapを使った。

React-Bootstrap

データ

国土交通省国土政策局国土情報課国土数値情報ダウンロードサービスの国土数値情報鉄道時系列データから取ってきた。国交省(と気象庁)は手軽にデータ数が増えないそこそこ多めのデータが手に入り、データベースの勉強に最適だと思う。(Twitterなどはリアルタイムにデータが変わるので、初学者にはつらい可能性?)

国土数値情報 鉄道時系列データの詳細

今後

気が向いたらPHPAPIを書き直すかもしれません。(現状の実装がとても汚いことは自覚している・・・)

あと、もっと機能付け加えた方がいいのかな。シンプルイズベストで、今の感じが結構気に入ってるけど、やる気が起きてアイデア浮かべば実装するかも。

感想

ひとりISUCON、つらいけど楽しかったです() ISUCON6も決勝頑張っていきたいと思います!

謝辞

協力してくれたものづくりサークルkstmのメンバー達、様々な情報を提供している先人達、データを公開している国交省の人達、その他何かしらで関わってる人達、感謝です!

供養

この作品は前作の全面改修でもあります。もう使われることは無いと思うので、ここに残しときます。

前作ったやつ

位置情報から路線を取得するテスト。

それのソース

GitHub - Goryudyuma/location

ひどさ

JSがわからなくて、PHPでJSのコード生成してたりする。と聞くだけで想像する方法とはたぶん違う方の生成。どうしても詳細が知りたかったらソースみて。うんコードが大量にある。見ない方が幸せ。

動機

電車に乗っているときに、今乗っている路線の情報とか取得できたらおもしろそうって思った。ただしこの前作では、新幹線など駅間が長いところに乗っていると、横の在来線に乗っている判定がされることが多々ある。(今どの路線に乗っているかの判定が再近隣駅から判定しているため。)

さらば

まともに書いた初めてのwebアプリよ、さらば。