Neos - React Rewrite

E3a43e2c588568daf6e1c873449df6a0?s=47 Bastian Heist
September 22, 2016
Programming
0
70

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

More Decks by Bastian Heist

See All by Bastian Heist
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
1
47
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
0
110
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
0
40
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
0
2.4k
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
0
58
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
0
49
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
2
3.4k
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
1
38
E3a43e2c588568daf6e1c873449df6a0?s=48 beheist
1
110

Other Decks in Programming

See All in Programming
5c097a7b75c8802b073774faa7276503?s=48 optim
5
330
7eca3e06edc3c69004aaf57de51900c2?s=48 ajstarks
2
310
C9ab1175a6981a2f67ce8d08aa17c15a?s=48 mpilquist
0
120
B8403d102456248570005ee7fb2ba0f7?s=48 tooppoo
4
430
3e049ed33195d00a8b745b16c63dce6e?s=48 leew
0
130
A3fabd96e2ca4bee5b0333ff2a640f01?s=48 translucens
2
110
A6a5e01b331d18dbd9c5de1f2cc2879f?s=48 erukiti
2
340
C302e84057a922dce0ecbe80207e3fcc?s=48 mu_zaru
0
280
Bbb17eeeecd3d9d06f4db310ab630a12?s=48 borkdude
2
440
Bf3acef686273e03fa4fdf125fdad3e9?s=48 kuncevic
0
110
E6143330e12cd226c3dab99f3fe8cb3e?s=48 yanaemon
1
140
D2fa8ba573b0be722502e673e025a96d?s=48 junichiromoro
1
140

Featured

See All Featured
C1daf20e5c49ff910745198ef9869ac2?s=48 hatefulcrawdad
257
16k
E190023b66e2b8aa73a842b106920c93?s=48 zenorocha
295
39k
A9a491b0fcbe0fbce3d64063a37add99?s=48 rmw
7
550
79acae287842acf29084005533a7fb3b?s=48 hursman
103
9k
6bb82b13cda86d3b821fa44100335ddf?s=48 thoeni
2
300
E4f5d494ebdc9e7cce1aecf3ce3e8bc1?s=48 shpigford
163
18k
78b475797a14c84799063c7cd073962f?s=48 holman
458
270k
D8fc2580cfaca035f666d9e4ee79a7f7?s=48 mongodb
23
3.7k
06f8b41980eb4c577fa40c41d5030c19?s=48 keathley
12
430
F383c6a4dc55e331bbe2987b622cee6b?s=48 stephaniewalter
256
10k
Bfd6b681ec6e8c9bef82ff0521c364f7?s=48 kastner
51
1.8k
11c84dff30266b907714802088852677?s=48 jasonvnalue
80
7.8k

Transcript

  1. ♥

  2. 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)
  3. None

  4. ♥

  5. None

  6. Open Source Modern CMS Intended as TYPO3 successor https://neos.io Editor

    Experience Developer Friendly

  7. A very quick demo What is Neos?

  8. Basics? React+Redux

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

  10. state?

  11. State is immutable React+Redux

  12. Component Action Reducer State

  13. Actions React+Redux

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

  15. Why rewrite?

  16. Why rewrite?

  17. Issues… Why rewrite?

  18. Responsiveness Why rewrite?

  19. Overflowing Styles Why rewrite?

  20. Planned Features Why rewrite?

  21. Extensibility Why rewrite?

  22. Ecosystem Converging to Flux Pattern Why rewrite?

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

  24. Principles Action Reducer Action Reducer Action Reducer :(

  25. Principles Action Reducer Reducer Reducer :)

  26. The Rewrite

  27. State Structure

  28. State Structure

  29. State Structure

  30. State Structure

  31. State Structure

  32. Sagas

  33. PlowJS - Curried Selectors

  34. CSSModules + Themr

  35. Tackling the iframe… ContentCanvas.js

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

  37. Tackling the iframe…

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

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

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

    December

  41. Meetup Oct 19, 2016 - 19:00 - UDG Mainz

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