ReactJS is an open-source library created and maintained by facebook. Right now it has more than 60.000 stars on Github and the surrounding community is getting bigger and bigger. Many well-established companies or fast developing startups have decided to use it in order to provide responsive and modern user interfaces by taking advantage of its powerful features.
So let’s see why ReactJS has become so popular during last 2 years:
- ReactJS is the view layer in our applications and it does this job really well without trying to achieve anything more.
- Learning curve is not that stiff. Most of developers can create a small prototype within some hours during their very first attempts with it. This is a huge benefit since developers don’t feel overwhelmed and companies can definitely avoid spending a fortune to educate their employees.
- It is quite non-opinionated so we are free to choose the tools and technologies we prefer to use with it. We can still start with ES5 or jump straight away to ES6 syntax. We can use TypeScript or Flow to add typechecking into our codebase or we can simply avoid doing so. We can use whatever tool we like to implement async requests like fetch, axios, superagent etc. We can use experimental features with babel like property initializer syntax, object rest / spread transform and many more. Too much freedom right?
- ReactJS plays really well with the most famous state management libraries out there such as Redux, Flux and MobX. Once again developers are free to choose the right tool for the right job and build a super-responsive user interface that can scale really well without writing volumes of spaghetti code.
- Components can easily get unit-tested so by definition we deliver well-structured, more safe and robust code. This is so important for a professional project!!! Unit testing is not a painful process for ReactJS since there are tools like Jest & Enzyme that make TDD a breeze. Enzyme gives us the opportunity to test our components as units with its shallow-rendering API or even in full-rendering state while Jest has introduced snapshot testing for ReactJS components.
- Despite the fact that it is not built on top of Web Components technologies such as HTML Imports, HTML Templates, Shadow DOM etc it brings us as closer as possible to Web Components concept compared with any other library / framework out there. In ReactJS we can create small, abstracted and reusable pieces of code with specific markup, logic and styling. JSX syntax might look awkward at first but it helps us integrating html code into our components. For scoped styling we need to apply CSS Modules pattern and use a modern bundler such as webpack or browserify. It is quite common to create a library of custom components in a ReactJS project and reuse them at will globally. This makes development and debugging much faster.
- Server Side Rendering by combining a NodeJS server and ReactJS helps us build even more complex applications by pre-rendering the initial state of our ReactJS components. Because of SSR we can tackle common issues of Single Page Applications such as problematic indexing by crawlers, faster initial loading etc. We can still keep using solid state management tools like Redux as we discussed above and provide an awesome user experience.
- Functional Programming has gained lots of traction during last years and ReactJS because of its Purely Functional Views is the ultimate representative in frontend world. In functional programming a “pure function” is one that does not change anything outside its scope and returns always the same output if the same input is given without any side-effects. The functional approach guides the developer to decompose a program into small functions, which are then combined to form an application. ReactJS stateless components act like pure functions while composition is highly enforced instead of inheritance to reuse code between components.