Neos - React Rewrite

Neos - React Rewrite

My talk about the NeosCMS backend rewrite to React, held at the DarmstadtJS meetup on Sep 22, 2016.

E3a43e2c588568daf6e1c873449df6a0?s=128

Bastian Heist

September 22, 2016
Tweet

Transcript

  1. Bastian Heist • 7 years as SAP Consultant / Developer

    @ Merck • Freelance Web Developer since 2009 • Fulltime Web Developer @ sandstorm since 2015 • Neos since 2015 @beheist @bastianheist (Neos Slack)
  2. None
  3. None
  4. Open Source Modern CMS Intended as TYPO3 successor https://neos.io Editor

    Experience Developer Friendly
  5. A very quick demo What is Neos?

  6. Basics? React+Redux

  7. y = f(x) DOM = react(state) React+Redux

  8. state?

  9. State is immutable React+Redux

  10. Component Action Reducer State

  11. Actions React+Redux

  12. Reducer newState = f(oldState, action) React+Redux

  13. Why rewrite?

  14. Why rewrite?

  15. Issues… Why rewrite?

  16. Responsiveness Why rewrite?

  17. Overflowing Styles Why rewrite?

  18. Planned Features Why rewrite?

  19. Extensibility Why rewrite?

  20. Ecosystem Converging to Flux Pattern Why rewrite?

  21. 16655 lines of Ember 1.x code The Rewrite

  22. Principles Action Reducer Action Reducer Action Reducer :(

  23. Principles Action Reducer Reducer Reducer :)

  24. The Rewrite

  25. State Structure

  26. State Structure

  27. State Structure

  28. State Structure

  29. State Structure

  30. Sagas

  31. PlowJS - Curried Selectors

  32. CSSModules + Themr

  33. Tackling the iframe… ContentCanvas.js

  34. Tackling the iframe… Frame.js Component Tree <> DOM Tree!

  35. Tackling the iframe…

  36. Contributing https://github.com/neos/neos-ui

  37. Contributing /neos -> old /neos! -> new

  38. Contributing Plan: ship React UI alpha with Neos 3.0 in

    December
  39. Meetup Oct 19, 2016 - 19:00 - UDG Mainz

  40. https://neos.io Thank you!