DEV Community

Cover image for This is why everyone is using Reactjs
Sanjay Singh Rajpoot
Sanjay Singh Rajpoot

Posted on

This is why everyone is using Reactjs

React Js is one of the most popular front-end frameworks to use these days. It is playing an essential role in the front-end ecosystem.

But what makes it so special?

here are some key feature that comes with React Js

  • Simplicity
    ReactJS uses JSX file which makes the application simple and to code as well as understand. We know that ReactJS is a component-based approach which makes the code reusable as your need. This makes it simple to use and learn.

  • Declarative UI
    This feature makes React code more readable and easier to fix bugs. React JS is the best platform to develop UIs that are both exciting and engaging not just for web apps, but mobile apps as well.

  • Enables Building Rich UI
    The UI of an app is extremely important nowadays; an app with a great UI that offers an exciting browsing and shopping experience to users definitely has a much better chance of succeeding than one with a poor interface.

  • One-way Data Binding:
    One-way data binding, the name itself says that it is a one-direction flow. The data in react flows only in one direction i.e. the data is transferred from top to bottom i.e. from parent components to child components.

  • Virtual DOM
    A virtual DOM object is a representation of the original DOM object. It works like a one-way data binding. Whenever any modifications happen in the web application, the entire UI is re-rendered in virtual DOM representation.

  • JSX
    JSX stands for JavaScript XML. It is a JavaScript syntax extension. Its an XML or HTML like syntax used by ReactJS. This syntax is processed into JavaScript calls of React Framework.

  • Performance
    ReactJS is known to be a great performer. This feature makes it much better than other frameworks out there today. The reason behind this is that it manages a virtual DOM. The DOM is a cross-platform and programming API which deals with HTML, XML or XHTML.

Give it a like if you make it this far!!

Follow for more web dev insights :)

reactjs #javascript #webdevelpoment

Discussion (12)

Collapse
miketalbot profile image
Mike Talbot • Edited on

See for me those might be the reasons to use it when it first became popular, other frameworks have matched those features or outclassed them by a country mile.

For me, the reason to use it in 2022 is that:

  • There's so much documentation, including on best practices
  • There are many pre-developed components both paid and unpaid
  • There's a huge community of developers to talk with
  • It's still good enough for many applications
  • It's very actively developed and gets better
Collapse
yongchanghe profile image
Yongchang He

Hello there,
Would you please recommend some excellent tutorials for beginners to learn with? Thank you!

Collapse
miketalbot profile image
Mike Talbot

I've been using React for around 7 years so anything I used as a first learning resource is way out of date now. At work we use PluralSight React courses - they are paid, but seem really good.

For me, the most important thing with learning React and working on projects in 2022 is the 2019 introduction of hooks. While hooks are a much better way of handling state in my opinion, working on a code base that includes code older than 16.8 will include the older method of state management (or both methods) - this is the danger of an older framework - it evolves - and as it evolves documentation becomes out of date. Paid courses will keep up to date, but free courses on the Internet may well be popular but outdated.

Thread Thread
yongchanghe profile image
Yongchang He

Thank you for sharing this!

Collapse
jesperhoy profile image
Jesper Høy

I respectfully disagree.

Your reasons are mostly technical - and 5+ years ago, those may have been the reasons people choose React.

But today, there are far better alternatives available - from a technical perspective.

I think today the popularity of React is simply self fueling - many user, components, jobs -> more users, components, jobs -> … etc.

From a developer perspective - I think the initial fascination with React is that you can author your UI basically as a function that returns HTML - with no regard for how that HTML is later updated - you simply re-render the whole thing again and again on any and every update (and let React do the hard work to reconsile DOM etc. behind the scenes).

Easy for the developer - but consider all those CPU cycles wasted (reconsiling virtual DOM) on all the end user devices that these web apps live on. How much extra energy / CO2 spent?

The virtual DOM IS pure overhead

Sure, our devices are usually fast enough that end-users won’t experience any performance issues - but they may have to plug-in and re-charge their phones a lot more frequently…

Collapse
natescode profile image
Nathan Hedglin

Well put. Pointless explaining it here. Far too many new developer that only know JavaScript because it's the end-all-be-all language for them.

React's more functional approach will live on but the Virtual DOM must die. But maybe not. Even desktop is being polluted my inefficient JavaScript apps.

Collapse
_yazan profile image
Yazan Qarabash

Great trade-off if you ask me

Collapse
natescode profile image
Nathan Hedglin • Edited on

Virtual Dom isn't a selling point. It is merely and implementation detail. I can pretty much guarantee the future libraries / frameworks won't use virtual DOM as it's much slower than later techniques.

Collapse
raddevus profile image
raddevus

The one reason I'm looking at React is as a way of creating HTML Components.
All I want are droppable units of HTML/JS/CSS that I can include in any project at any given time which solve a particular View challenge.

It is interesting that no one talks about React as a way to create a droppable component.

Is it because React doesn't make it easy or it doesn't work? Or is it because the idea of a component isn't seen as a necessary thing?
Imagine having components which solve UI challenges so that when you needed one you just went to a "library" & grabbed it and dropped it into your react solution.
Here's my best example of that: a file dialog where user needs to select a file that will be used.
file dialog

Collapse
aarone4 profile image
Aaron Reese • Edited on

Rebuttals and the case for Vue (then why still use React)
Simplicity
Vue built in directives are much easier to grok,
<p v-for="item in items" > Some info about {item.name} </p>
vs
items.map(item=> {
<p>Some JSX code about {item.name}</p>

Declarative UI
Vue uses the same conceptual components structure but IMHO the implementation of single-file-components where the [script], [template] and (scoped) CSS live together makes it much easier to understand and review.
I like React's passing down of functions to child components better than Vue's $emit to pass events back to parents, but once your app gets to a decent size and you are using app-wide state management it almost becomes irrelevant.

Enables Building Rich UI
A tie between React and Vue with the personal preference of having the HTML code separate in a template block in Vue rather than HTML(JSX) mixed in with the javascript logic

One-way Data Binding:
OWDB is fine, but a lot of the time you actually want TWDB and it is a PITA with React. Vue gives you the functionality out of the box with v-model.

Virtual DOM
V-Dom gets a lot of hate, but both systems use it and unless you have a massive app, users are not likely to see performance issues. the use of React.memo() can help, but I find the use of hooks (useCallback,useEffect,useContext) really hard to keep in my head all the time.

JSX
If you like HTML in your JS use React. If you would prefer to have JS in your HTML use Vue :)

Performance
For most apps performance is bragging rights. the differences between React, Vue, Angular, Svelte or any of the other modern frameworks in most environments is undetectable to the user.

Other Plus points for Vue
It is progressive. You don't even need to install it, you can call if from a CDN and you don't need a toolchain to bundle it up: you can hold all of your templates and components in a single file. There are some limitations if you do that but you can get up and running with Vue very quickly.
For me the Options API is easier to understand than the Composition API even though the latter gives you more flexibility.
Key packages such as Router, Animation and Flux pattern store (Vuex 3 or Pinia) are maintained by the core team. This means better compatabilty and less cognitive load as all applications are using the same external libraries.

The Case For React
Jobs, Jobs and Jobs. If you are a developer then there are more jobs in React than the other frameworks put together (I'm in the UK). If you are a hiring manager there are more React devs than the other frameworks put together.

Collapse
andrewbaisden profile image
Andrew Baisden

Since learning React I have had no need to learn another JavaScript front-end framework because there are more than enough job opportunities to go around.

Collapse
dnasedkina profile image
dnasedkina

Nice one! What about downsides though? It can't be all sunshine and rainbows :)