Zealup - React

こんな感じにReactを使ってます
React.js & AngularJS 勉強会 LT

自己紹介
• 株式会社zabuton
–矢納正浩(ﾔﾉｳﾏｻﾋﾛ)
–株式会社アットウェア
• フロントエンド(React, Angular)
• バックエンド(Java, Go, Python)
masahiro.yanou Burning-Chai

Zealup
https://info.zealup.jp

開発の仕方
Flux Application Architecture
Browserify, watchify, …...

問題発生
どのcomponentが
何をListenしてるか
わからない
あらゆるcomponentが
Listenして再描画が
たくさん

Smart Components
Storeからのデータの受取
描画のためのロジック
分離

Smart Components
Storeからのデータの受取
描画のためのロジック
分離
Smart Component
Dump Component

Smart Component
Listen Store
No Render
プロパティを多く持たない
API呼び出し
基本的に再利用しない

Dump Component
NO Listen Store
Render
API呼び出し
再利用をする

実際の画面を見てましょう

まとめ
• わかりやすくなった
–役割
• すっきりした
–再利用
• リファクタが必要(ToT)

参考URL
• Smart Components
– https://preact.gitbooks.io/react-
book/content/jsx/smart.html
• Zealup
– https://info.zealup.jp
• 株式会社zabuton
– http://zabuton.co.jp

Zealup - React

More Related Content

What's hot (6)

Viewers also liked (15)

Similar to Zealup - React (20)

Zealup - React