What is ReactJs and why it was created?

Hi, hope you are doing well. This blog will give you brief information about ReactJs. So, without wasting your time. Let's get started!

ReactJs is a free and open-source front-end JavaScript library. It is used to develop user interfaces or UI components. This library is developed and maintained by Facebook and its community. It was created by Jordan Walke, who was working as a software engineer at Facebook in 2011. Its initial public release was on 29/05/2013 with version 0.3.0.

"Hey, wait but why Facebook had created this hell?"

To understand the whole shit first, we have to go back into the stone age of web development. Life was great and developers were developing the frontend part by just using HTML with a little bit of styling. After that, JavaScript & CSS marked their entry. At this time developers started creating truly interactive websites but developers were still thirsty. Their thirst for creating complex websites was increasing day by day but the technology was not so great to fill their continuous growing demand. jQuery had marked its entry and lots of complexity got hidden behind it. It made the life of developers a lot easier but after some time Developers realized that they need something more advanced and robust because they started created even more complex websites with jQuery.

Facebook realized this need and created ReactJs which made the development process a lot easier and removed the headache of DOM manipulation. Sharing of data between different components became easier and changes made in one component can easily be reflected in anotherJs was very easy to understand and it started getting popularity. It literally screwed the Angular which was the popular framework at that time. Remember, React is a library and not a framework.

"Ok dude, I got the point but what are the features which made it so popular?"

Declarative:

You just need to instruct your "Servant" a.k.a. React that I want this and it will do that exact same under the hood and the great thing about this is that you do not need to worry about "how it's done". Which makes the life of developers a lot simpler than before. Although there might be some cases in real life where we really need some control. In that scenario, we can go the Imperative way and tell React exactly "how to do" also.

Component Based:

React is all about components. If you want to build something in React then you first need to create a component. These components can have their own memory which is called "State" in React. These States can be changed or manipulated through "Handler Functions" by calling these functions. State can be passed to another component throughs "props". These components can work standalone and can be easily integrated with other projects. This means that we can easily create library of components as per our need or requirements and we can use it in different applications or projects.

"Wow, that's great!"

Learn Once, Write Anywhere:

React can be used to develop applications for different devices. It can be used to develop web applications, mobile applications (React Native), desktop applications ( Electron ), etc. You just need to learn the core concepts of React and these core concepts can be utilized for developing applications on different platforms. Although there are differences in syntax but the learning curve is not too steep.

Virtual DOM:

Now, you don't need to manipulate the DOM (Document Object Model) directly. React creates a Virtual DOM which is a virtual representation of the Original DOM and it remains in the memory. Whenever a State changes then a new Virtual Dom is created. This new Virtual DOM is compared with the previous Virtual DOM. React just take a look and say, "Hey, here is the change". After that React finds the most optimum way to reflect these changes to the actual DOM. This increases the performance of the application because we are not directly interacting with the DOM.

Single Source of Truth:

Data passed in React has unidirectional flow. Data from the parent component can be passed to all its child components. Any changes in the data of the top most component will get reflected in all its child components. It gives more control over data to the developers.

JSX:

It stands for Javascript XML and XML stands for Extensible Markup Language. JSX provides a way to write Javascript in HTML which is a very revolutionary idea in the web development field. Instead of writing HTML alone, now we can also write JavaScript in HTML. The syntax is similar to HTML and it's easier to grab. Although it uses XML rules. It is also immune to Cross Side Scripting attacks. JSX is optional and not required to use React but it makes development a lot easier.

That's enough for you to know about ReactJs and you could further explore the official doc of React. If you like this article and want to support me then please share it with your friends or colleagues. Knowledge get increases by sharing it and not by hoarding it. That’s what I am doing.

Thanks for giving your precious time. Goodbye!

Learn more about ReactJs on Faguni.

Gobind Jha

Hi, I am a Professional ReactJs Freelance Developer and also working for Faguni©. Writes articles for the benefit of fellow developers and try to provide best knowledge to them. Wish you SUCCESS in your life and have a WONDERFUL day!

❤ Please checkout our products ❤

reactjs-forms

Subscribe To Our Newsletter & Offers