マネーフォワードのAPIを提供したハッカソンに技術サポート兼デモサーバーのおもり兼メンター代打として参加してきた。
OAuth2といっても、使い方までいたれりつくせりのtwitter/facebook/github あたりのライブラリしか使ったことなかったので、一定時間で作れる範囲がだいぶ違うなーという感想。そりゃ世間のハッカソンも、ハッカソンという名のチーム戦・短納期デスマーチになるわ。
OAuth2API経由で触ったことないから、素振りしてみないと全部わかりませんで話にならんだろう、ってことで素振り。
ただ、ギョームに追い詰められて、当日含めてもtoken取るところまで疎通確認するのでやっとだった。
ハッカソン後日にようやく出来て、おもしろおかしい成果物animetion gifが撮れてほっとした。
おもしろおかしく書いたエントリ: Moneyforward APIで車ゲームを作る | Money Forward Engineers’ Blog
構造を知っている、入出金履歴のデータを引っ張ってくる。
日にちごとにサマリーして、ない日は0で埋める。
それを元データにして座標プロットして、phaserjsのexampleの座標データと差し替える。
たったこれだけやるのに、56 commits / 4,571 ++ / 398 —
仕様はOAuth2でわかりやすい、データ取りに行くはじめのところはsimple-oauth2のexampleからコピペ、ゲーム部分はphaserjsのexampleからコピペ、でほぼ何もしてないのに結構時間はかかるわ、$40の有償プラグイン使うわで、しんどかった。
デモサーバー自体は多分クローズドだから、サーバー立てておいてみんなに遊んでもらうわけにもいかないし。
遊べたとしてもみんなデモデータだからなー。
作り始める時には意図しなかったいいオチが勝手についてくれた幸運と、読んでくれた人は楽しんでくれたみたいなので救われる。
成果物 https://github.com/sanemat/purple-finch とpackage.json(最後)。
ライブラリは提供していないので、simple-oauth2を使い、それを使ってるライブラリを見ながらぱくる。
なぜか手元でdirenvが動かなくて、dotenv使うことにしたのがはまったとこ。
テンプレートにmarkojs使ってみたのは初めて。
https://github.com/marko-js/templating-benchmarks pugかejsか使おうと思ってたところでこれ見て使ってみることにした。
node --inspect --debug-brkってのもおもしろい。サーバー起動すると、websocketのurlが出て、それをchromeで開くと一行目で止まる。
ブレークポイントを入れて、play!
ゲームエンジンphaserjsも、なにかゲームエンジン使ってみたかったので多少は満たされた。カジュアルゲー作れるぐらいの瞬発力は欲しいもん。
github pagesに置いて動くようにしたいところだけど、implicit flowじゃないからだめなんかな。
aws lambdaやamazon api gatewayかそういうの使えばgithub pages + それで出来そうな気がしたけど、気がするところまで妄想しただけで確認していない。こういうのAmazon API Gateway の Custom Authorizer を使い、OAuth アクセストークンで API を保護する – Qiita かな。
package.json
{
"dependencies": {
"dotenv": "^2.0.0",
"express": "^4.14.0",
"marko": "^3.12.1",
"moment": "^2.17.0",
"moment-timezone": "^0.5.9",
"request": "^2.79.0",
"request-promise-native": "^1.0.3",
"simple-oauth2": "^1.0.1",
"urijs": "^1.18.3"
},
"scripts": {
"start": "node -r dotenv/config app.js",
"debug": "node --inspect --debug-brk -r dotenv/config app.js",
"lint": "eslint .",
"lint:fix": "eslint --fix .",
"test": "ava",
"verify": "npm run lint && npm test"
},
"devDependencies": {
"ava": "^0.17.0",
"eslint": "^3.10.2",
"eslint-config-airbnb": "^13.0.0",
"eslint-plugin-import": "^2.2.0"
}
}
ダウンロード数、priceだと
金額、ratingだと
レーティング、rating-countだと
レーティングの数、が表示できる。
