React has been very popular and it is now widely used by developers around the globe, and not just a few of them commenting on how amazing it is for creating user interfaces.

Also, looking at the overview opinions on technologies surveyed over time from JS Survey, almost everyone has heard about React. Furthermore, most developers are happy with their experiences with React and would love to use it again for their future web developments.

What is React?

First, we'll start with what React is, and why it shines in the developers' world.

React is a Javascript library for building user interfaces. We can think of it as a series of jigsaw puzzles, where each puzzle piece represents what we call a component in a website or application. For example, we have four puzzle pieces. They are button, sidebar, text, and slider. React will then act as the magic glue that holds all these puzzle pieces together and create a website that works seamlessly!

React is Simple and Reusable!

Another main thing that makes React amazing is its simplicity and reusability!

We think of the components like lego blocks. In the image above we have four lego blocks. They are button, slider, search, and navigation bar. We store all these blocks in a shared folder, where multiple developers are able to access and reuse these blocks to build different structures!

When developer A is working on a homepage that needs a button, a navigation bar, and a slider, they create these three components and then store them in a shared folder. At the same time developer B is working on a search page which requires: a button, a slider, and a search bar. Since they already have button and slider components available in the shared folder, developer B can reuse these two components and only build a search bar. This method will save both developers a lot of time and effort, as well as eliminating any work duplications.

React is Smart, Fast, and Efficient!

The next amazing thing about React is that it's smart, fast, and efficient. It keeps track of all the changes happening on the screen and only updates what is necessary.

DOM (Document Object Model) represents a website with a logical tree. Looking at the graph on the left hand side, we can see how each element has a smaller group of elements. We can think of it as a painting, where the painting’s outline is the document and the painting’s inner lines and colours are the elements inside the document.

A traditional approach, such as JQuery might spend unnecessary resources by re-rendering the whole document or tree structure when trying to change only one of the element. Imagine having to repaint the whole canvas only to change a tiny part of a painting. That would be time consuming and might smudge the colours. However, React only makes a desired change and uses it as a guide to update the page/canvas. This process makes web development more efficient and less error-prone.

React has a Strong Community and Support!

React is very popular among developers and is used in loads of websites and applications, including the big ones like Facebook and Instagram! React has a big community of people who help each other by creating resources and improving the library.

Here are some of our team’s thoughts about React!

☺ “The fact that it forces you to think about componentization and trees !”

☺ “It’s not Jquery!!!”

☺ “It’s not Angular!!!”

☺ “No special templating language which makes it easier for refactoring”

☺ “Easy and logical hooks!”

☺ “It pays the bills!”

☺ “Easy to create reusable components”

☺ “Composability is first-class rather than extensibility”

☺ “Stopped FE from jumping to different tools every 6 seconds!”

Overall, I’ve been having good experiences working with React and please do share your thoughts with us!