Reactjs Overview
In the past years, in the area of
web development, there have been lots of trends consisting of new technologies
that stirred up the developers’ enthusiasm. A considerable amount of new ideas
and implementations have had their hour of fame. However, few of them were here
to stay.
One of those is React JS, the one
that gained the greatest popularity and appreciation from the front-end
community. It currently reaches about 2-3 million downloads per week, it is
supported by the billion-dollar company - Facebook, with the help of a
community of active contributors.
React is a library – NOT a
framework. What makes it not a framework is the fact that it is not a complete
solution and we will often have to use additional libraries with React to form
any front-end solution. But what makes React stand out from other practices?
1. Predictability and Declarability
Let’s take the following code example:
If you can
figure out how a page would look like in a matter of second only by looking at
some lines of code, that’s already an advantage. This is what we call declarative code.
“Declarative
code describes what we want, as opposed to imperative code that tells how to do
it.”
The
difference between then can be explained in a simple manner. Imagine yourself
going to a bakery. When you get there, you can ask the bakes either:
a. Can I please get a rosemary bread?
b. Dissolve sugar in warm water in a
medium bowl, and mix in the yeast. Mix in salt, butter, 1 tablespoon rosemary,
and Italian seasoning, 2 cups flour. Line a baking sheet with parchment paper. Place
dough on the baking sheet. Cover, and allow to rise 1 hour, or until doubled in
size. Place in oven at 190 degrees C. Please?
The option a. is the declarative way. It presents less bugs,
less misunderstanding, it has a smaller volume and it’s easier to adapt to it.
Because each line of code in the image above is “describing”
what it represents, they are called components.
Which leads to the second point:
2. Componentization
Usually, a React App is made up by a multitude of components.
This contributed to the reusability of code, the components having the ability
to be easily repeated across multiple pages. This saves valuable time on
development and testing, having a single source code for problems that might
appear in more than one place across the application.
3. JSX
Although it may not be appreciated by everyone, JSX is a
great way to bring the JavaScript advantages in an environment that resembles
the HTML markup. It allows you to use conditional rendering, to call functions
that return JSX as a value, to inject convenient ES6 features right in your
HTML-like code.
4. Mutations
In order to make changes to the state of a component, in
React you have to use the setState() function. This extra step is because the
state is a valuable piece of information and any change made to it can affect
your component’s behavior. We can also take this additional explanation by Revanth
Kumar:
“This is because React
wants to re-run certain life cycle hooks, [such as] componentWillReceiveProps,
shouldComponentUpdate, componentWillUpdate, render, componentDidUpdate,
whenever state changes. It would know that the state has changed when you call
the setState function. If you directly mutated state, React would have to do a
lot more work to keep track of changes and what lifecycle hooks to run etc. So
to make it simple React uses setState.”
5. React Native
With a popularity and performance above the charts, React
Native is a powerful tool for building native mobile applications. Is has a
structure and logic similar React JS, and it is easy to pick up if you come
from this environment. It uses the same code to build applications on iOS as
well as on Android, while giving you the advantage of using components native
to your platform in the application.
Conclusion
With many advantages not covered in this article, React keeps
attracting the developers’ interest, being the library that revolutionized how
we write and treat front-end code nowadays. With an active community and
support from the many corporations that use it (such as Netflix, Airbnb, Yahoo,
Atlassian, Coursera, Uber, WhatsApp, Dropbox, etc), we can only predict a long
and successful life for React.
frontend community reactjs reactjs trends
5 comments
Your blog is interesting to read, thanks for sharing this and keep update your blog regularly.
ReplyDeleteReactJS Training in Chennai
ReactJS course in Chennai
AngularJS Training in Chennai
Angular 6 Training in Chennai
Web Designing course in Chennai
PHP Training Institute in Chennai
ccna course in Chennai
ReactJS Training in Porur
ReactJS Training in Tambaram
ReactJS Training in Velachery
Popular Fashion Blogs in Surat
ReplyDeleteFashion Blogger in Surat
Surat Blogger
Indian Fashion Blogger
Have written a blog with clear content in it. Thanks for sharing. I believe that blog would help many to get clarified with their doubts.
ReplyDeleteangular js training in chennai
angular js online training in chennai
angular js training in bangalore
angular js training in hyderabad
angular js training in coimbatore
angular js training
angular js online training
Good Post! Thank you so much for sharing this pretty post, it was so good to read and useful to improve my knowledge as updated one, keep blogging.
ReplyDeleteCyber Security Training Course in Chennai | Certification | Cyber Security Online Training Course | Ethical Hacking Training Course in Chennai | Certification | Ethical Hacking Online Training Course | CCNA Training Course in Chennai | Certification | CCNA Online Training Course | RPA Robotic Process Automation Training Course in Chennai | Certification | RPA Training Course Chennai | SEO Training in Chennai | Certification | SEO Online Training Course
Machine Learning Projects for Final Year machine learning projects for final year
ReplyDeleteDeep Learning Projects assist final year students with improving your applied Deep Learning skills rapidly while allowing you to investigate an intriguing point. Furthermore, you can include Deep Learning projects for final year into your portfolio, making it simpler to get a vocation, discover cool profession openings, and Deep Learning Projects for Final Year even arrange a more significant compensation.
Python Training in Chennai Python Training in Chennai Angular Training Project Centers in Chennai