Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
2016. 08. 24.
AKIRA-MIYAKE
AKIRA-MIYAKE
• Twitter: @DreamOfEleCat
• GitHub: https://github.com/AKIRA-MIYAKE
• Blob: http://dream-of-electric-cat.hate...
•
• UI
• JavaScript / HTML / CSS
•
• Node.js(Express) API
• Swift iOS
• React + Redux + react-router
• ES2015 + Babel + Webpack
• PostCSS + cssnext
• Mocha + power-assert
• ESLint + Airbnb Jav...
SPA
•
•
•
Flux
Flux
• View Store
•
• Store Action Dispatcher
•
•
Store
•
•
• URL
• URL
Store
Store
•
•
•
•
•
•
•
•
Store / Action
• Store
Action
• View Store
• Action
•
Presentational Component /
Container Component
• http://redux.js.org/docs/basics/UsageWithReact.html
• Presentational Comp...
•
• Store Action
•
•
•
•
•
フロントエンドの設計に関する考察
Upcoming SlideShare
Loading in …5
×

フロントエンドの設計に関する考察

Vue.js: Revolutionary Front-end #1 With Evan Youで発表しました。

  • Be the first to comment

フロントエンドの設計に関する考察

  1. 1. 2016. 08. 24. AKIRA-MIYAKE
  2. 2. AKIRA-MIYAKE • Twitter: @DreamOfEleCat • GitHub: https://github.com/AKIRA-MIYAKE • Blob: http://dream-of-electric-cat.hatenablog.com/
  3. 3. • • UI • JavaScript / HTML / CSS • • Node.js(Express) API • Swift iOS
  4. 4. • React + Redux + react-router • ES2015 + Babel + Webpack • PostCSS + cssnext • Mocha + power-assert • ESLint + Airbnb JavaScript Style Guide
  5. 5. SPA
  6. 6. • • •
  7. 7. Flux
  8. 8. Flux • View Store • • Store Action Dispatcher • •
  9. 9. Store • • • URL • URL Store
  10. 10. Store • • • •
  11. 11. • • • •
  12. 12. Store / Action • Store Action • View Store • Action •
  13. 13. Presentational Component / Container Component • http://redux.js.org/docs/basics/UsageWithReact.html • Presentational Component • • • Container Component • Presentational Component • Store Presentational Component • Action
  14. 14. • • Store Action • •
  15. 15. • • •

×