Don't over React
For many years now Javascript has been used to create 'sexy' font-end interaction for websites. Javascript has gone through several iterations over the years and the latest flavour is 'React'. What is 'React' I hear you cry?
Well, 'React' is a Javascript library which is used to create the user interface (the bit you see) for web applications. It was created by Jordan Walke, a Facebook engineer. For those of you who know a bit about web development and the MVC pattern (Model-View-Controller) - 'React' can be used as the V (view) in MVC. Which is nice...
Because React is a JavaScript framework using it is simply a case of including a JavaScript file in our HTML and using the React exports in our application's JavaScript. In the past web developers added 'shed' loads of Javascript to a page, to get the web application to do 'funky' things. This JavaScript would interact directly with a browser's Document Object Model (DOM). 'React' does not operate in this manner. Instead it relies upon a 'virtual DOM' and runs entirely in memory.
The Umbraco CMS creates urls for content, so to work with this we need a 'router' that works with 'React' to 'reroute' these urls. This means we need an API, which could be a single controller, getting the Umbraco content by URL or NodeId. It could also be a set of controllers working with the content types.
So, what are the advantages to using 'React' with Umbraco? Well, to get an idea of how React works, go to Facebook.... It's a React application. The advantages of using 'React' are deemed to be:-
- User interface development can be done without needing to synchronise with Umbraco development.
- Reduced frontend-backend integration
- Frontend developers do not need indepth knowledge of Umbraco
- The end user experience is enriched.
However, it is early days of using 'React' with Umbraco, so an element of caution would be prudent. Older browsers and older computers might struggle with delivering 'React' websites in a timely manner. Also, search engines may not recognise purely 'client-side' HTML generated from Javascript. However, there are ways around some of these issues and 'React' has many exciting possibilities!
Further reading:-
https://our.umbraco.com/forum/developers/razor/63113-Reactjs
