Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
React + flumptでイカ戦績グラフ化ツールを作ってみた
Search
nabeliwo
July 22, 2016
Programming
0
170
React + flumptでイカ戦績グラフ化ツールを作ってみた
2016/5/19のGizumo Tech Conf #1での発表資料です。
nabeliwo
July 22, 2016
Tweet
Share
More Decks by nabeliwo
See All by nabeliwo
多言語化対応における TypeScript の型定義を通して開発のしやすさについて考えた / TSKaigi TypeScript Multilingualization
nabeliwo
2
620
Dive into SmartHR UI
nabeliwo
3
1.1k
Web Componentsを使ったウィジェット埋め込みの話
nabeliwo
0
290
Snowpack で始めるバンドルレス開発 / about Snowpack
nabeliwo
0
150
おいでよ フロントエンドの森 / welcome-to-front-end
nabeliwo
0
83
React事始め
nabeliwo
0
540
お前もJavaScriptにしてやろうか〜アメーバピグ編〜
nabeliwo
0
440
Other Decks in Programming
See All in Programming
perl for shell, awk and sed programmers
mackee
2
920
2024-10-01 dev2next - Observability for Modern JVM Applications
jonatan_ivanov
1
140
Successful with Signals: 3 Rules for Your Architecture
manfredsteyer
PRO
0
130
4年間変わらなかった YOUTRUSTのアーキテクチャ
daiki1003
2
670
急速に利用拡大を続ける飲食店向けサービスで 店内端末同士のローカル通信を追加設定なしで実現した話
whatasoda
0
140
ML-прайсинг_на_Lamoda__вошли_и_вышли__приключение_на_20_минут__Слава_Цыганков.pdf
lamodatech
0
380
Kubernetes上でOracle_Databaseの運用を楽にするOraOperatorの紹介
nnaka2992
0
170
게임 개발하던 학생이이 세계에선 안드로이드 개발자?
pangmoo
0
120
GrafanaのHTTP API を眺めてみよう
rinchoku
0
440
自分だけの世界を創るクリエイティブコーディング / Creative Coding: Creating Your Own World
chobishiba
2
2k
Vertical Architectures for Scalable Angular Applications
manfredsteyer
PRO
0
180
現場から考えるソフトウェアエンジニアリングの価値と実験
nomuson
1
140
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
87
5.6k
The Power of CSS Pseudo Elements
geoffreycrofte
71
5.3k
No one is an island. Learnings from fostering a developers community.
thoeni
19
2.9k
How to Think Like a Performance Engineer
csswizardry
18
1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
126
18k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
33k
Build The Right Thing And Hit Your Dates
maggiecrowley
32
2.3k
Done Done
chrislema
181
16k
Why You Should Never Use an ORM
jnunemaker
PRO
53
9k
Practical Orchestrator
shlominoach
186
10k
Optimizing for Happiness
mojombo
375
69k
A better future with KSS
kneath
237
17k
Transcript
React + flumptでイカ䨌 籐グラフ⻉ツールを⡲ってみた @nabeliwo Gizmo Tech Conf #1 on
Mar 19 2016
ジコショウカイ @nabeliwo Gizmo inc. フロントエンドエンジニア JSと穠㭴した Reactだいすきマン 剑鵚はゲーム㹋屣やってる オフパコし(ry
None
モチベーション ナベとサクモトによる「タッグマッチでA+99湡䭷す」 ちたい→てない→ⴓ匿だ→つくろう!! グラフ⻉することで鋅えてくるものがあるのでは? イカエンジニアとしてイカにまつわるものを⡦か⡲って婍した かった 傀㶷のツールだけでカバーしきれなかったので⡲った
エンジニアはイカ㥨き㢳い IkaLog stat.ink スーパーイカメーカー ウデマエアーカイブ etc…
イカグラフとは イカ䨌籐グラフ⻉ツール 䨌籐を䩛Ⰵ⸂したらあとは䩛にキルレとか桦とか どのブキがどれくらい⢪われてるかとか䖤䠐♶䖤䠐な ルールステージとかとかグラフ⻉してくれる リリースはにさわなかったので➙傈はローカルでごめ んなさい…(2016/03/19儗挿)
DEMO
䪮遭スタック
サーバーサイド Node.js hapi(APIサーバー) MySQL ➙傈はサーバー⩎の鑧はしません
クライアントサイド ES2015 (BABEL) React flumpt (Flux impl by @mizch) ウェイスタック
あと♧䘔CSSはPostCSSつかってる
ⵖ⡲劍 圓䟝と圓鸡、圓䧭罋えるのに1鹈くらい コード剅くのに4傈 㻅たら娤ぬと䙼ったので僴傈㻅ないで⡲っ
やってること データ《ってきてクライアントでごにょごにょしてChart.js 鸐してはきだす SQLが蕱䩛なのでデータは黝䔲にとってきてクライアント でⰋ鿇よしなにする
䪮遭鼅㹀のおはなし ウェイスタックやりたくて葿ղ䱱した Reduxはちょっとなんかもうつかれた Relay(GraphQL + React)で馄ウェイしようと䙼ったけど ⹛くsampleが㶷㖈せず䮲䫓 謬い㹋鄲!謬い㹋鄲! React +
flumptとの⳿⠓い
flumptのおはなし pubsub堣腉だけ䠐陎して兛鸐にFluxすればいいか んじ 㷕统コストがものすごくひくい。Reduxが䝤눤に鋅え る FluxⰅしたい➂はやるといいかも
たいへん だったこと
葺かったら♧筰にやりましょう NintendoID:nabeliwo
None