React + flumptでイカ戦績グラフ化ツールを作ってみた

2016/5/19のGizumo Tech Conf #1での発表資料です。

Transcript

1. React + flumptでイカ䨌 籐グラフ⻉ツールを⡲ってみた @nabeliwo Gizmo Tech Conf #1 on Mar 19 2016
2. ジコショウカイ @nabeliwo Gizmo inc. フロントエンドエンジニア JSと穠㭴した Reactだいすきマン 剑鵚はゲーム㹋屣やってる オフパコし(ry
4. モチベーション ナベとサクモトによる「タッグマッチでA+99湡䭷す」 ⹧ちたい→⹧てない→ⴓ匿だ→つくろう！！ グラフ⻉することで鋅えてくるものがあるのでは？ イカエンジニアとしてイカにまつわるものを⡦か⡲って婍した かった 傀㶷のツールだけでカバーしきれなかったので⡲った
5. エンジニアはイカ㥨き㢳い IkaLog stat.ink スーパーイカメーカー ウデマエアーカイブ etc…
6. イカグラフとは イカ䨌籐グラフ⻉ツール 䨌籐を䩛Ⰵ⸂したらあとは⹧䩛にキルレとか⹧桦とか どのブキがどれくらい⢪われてるかとか䖤䠐♶䖤䠐な ルールステージとかとかグラフ⻉してくれる リリースは꟦にさわなかったので➙傈はローカルでごめ んなさい…(2016/03/19儗挿)
7. DEMO
8. 䪮遭スタック
9. サーバーサイド Node.js hapi(APIサーバー) MySQL ➙傈はサーバー⩎の鑧はしません
10. クライアントサイド ES2015 (BABEL) React flumpt (Flux impl by @mizch) ウェイスタック あと♧䘔CSSはPostCSSつかってる
11. ⵖ⡲劍꟦ 圓䟝と圓鸡、圓䧭罋えるのに1鹈꟦くらい コード剅くのに4傈
    㻅たら娤ぬと䙼ったので僴傈㻅ないで⡲っ׋
12. やってること データ《ってきてクライアントでごにょごにょしてChart.js 鸐してはきだす SQLが蕱䩛なのでデータは黝䔲にとってきてクライアント でⰋ鿇よしなにする
13. 䪮遭鼅㹀のおはなし ウェイスタックやりたくて葿ղ䱱した Reduxはちょっとなんかもうつかれた Relay(GraphQL + React)で馄ウェイしようと䙼ったけど ⹛くsampleが㶷㖈せず䮲䫓
    謬い㹋鄲！謬い㹋鄲！ React + flumptとの⳿⠓い
14. flumptのおはなし pubsub堣腉だけ䠐陎して兛鸐にFluxすればいいか んじ 㷕统コストがものすごくひくい。Reduxが䝤눤に鋅え る FluxⰅꟌしたい➂はやるといいかも
15. たいへん だったこと
16. 葺かったら♧筰にやりましょう NintendoID:nabeliwo