12 reasons why ReactJS has taken over the world -
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.
- It is JavaScript after all. When writing code in ReactJS we don’t have to do that much react-ish things or extend custom objects constantly and dive for hours into documentation because we don’t remember this method or that. Sounds familiar right? This is definitely not the case with ReactJS. We can use latest JavaScript goodies by transpiling our code with the tools we prefer like webpack, browserify, rollup, babel etc
- 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?
- All these help ReactJS developers in becoming faster much more familiar and comfortable with JavaScript itself and all new features it offers. Nowadays, JavaScript evolves rapidly so this is extremely beneficial for every engineer individually. Getting better and better as a ReactJS developer means you are really getting stronger with JavaScript itself too. I am sure some of you have spent tons of hours in the past to learn a JS framework / library and now that it has faded you feel sad about all these hours you devoted mastering it right? This is definitely not the case here.
- 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.
- ReactJS offers its own typechecking mechanism through PropTypes. By using them we can catch lots of bugs early enough. Many developers are using JavaScript extensions like Typescript or Flow to typecheck the whole application but if we don’t want to add some extra complexity in our codebase PropTypes can do the job quite well.
- 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.
- Teams collaboration is hell better because of ReactJS. All this modular system that is enforced, helps developers to split tasks easier and avoid overlaps and side-effects. Even web designers with average JavaScript coding skills can create small components, apply some dedicated styling and then share them with the rest of the team for further development.
- 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.