Neos + React

We strive to keep Neos a performant and flexible content application platform with a great user experience. At the beginning of 2016 we therefore chose to switch to React as the basis for the Neos backend interface.

– Written by


Since the initial ideas and concepts of Neos, we always strived for the most performant and flexible solutions to keep our users happy and the level of innovation constantly high. This does not only apply for the editorial concepts, and the backend technologies, but also for the user interface of Neos.

Striving for the best solutions comes with change. In the first quarter of 2016 we decided to switch from Ember to React as a foundation for our user interface. The development began with an experiment a couple of weeks before. Wilhelm Behncke and Tyll Weiß of sitegeist created a solid prototype of the Neos UI with React which showed off how predictable and easy to understand the new architecture is, while also promising a great level of extensibility and modularity.

What is React

React is a small, modern and flexible JavaScript library which enforces best practices, modern language features and optimizes the way we think about user interfaces in general. It is the most mature technology to fit the requirements of a modern UI like Neos. Due to the size of the React community, we also hope to attract more developers to join our efforts in producing the best content application platform out there.

Why React

With React backing our UI development, we hope to deliver a way more performant and stable interface thanks to the state of the art rendering of React. Our aim is also to provide a top notch code base for every Neos developer/enthusiast to extend and maintain Neos with.

But it is not all about React, the rewrite is way more oriented into a direction to align the concepts of the backend into the frontend as well. We incorporate a unidirectional data flow, state of the art dependency management as well as a modern build process.

Our Vision

What instantly got our attention was the similarity of React's unidirectional data flow and CQRS/event sourcing on the server side. This is one of the biggest benefits of the new architecture. But we won’t stop there, the plan is to join efforts and to resemble as many of the concepts as possible. We also decoupled the embedded website into a separate frame, to reduce the conflicts with website related assets like CSS and JavaScript.


Interested?

There are not many open source projects of such scale written with React and Redux yet, so if you would like to get an experience of working in an open source community and help create the best editing experience in the market, get in touch and join us!

  1. Check out the source code on Github
  2. Get in touch with Sebastian Kurfürst, organizational lead of the project
  3. Come hang out with us in our cozy Slack channel (register here)
  4. Join one of the upcoming code sprints to hack away on the project together

What People are saying