We're going to be learning about React a web framework
According to Stack Overflow and the most recent survey, React JS is one of the most loved and desired web frameworks, beating out Angular, Vue, and a variety of excellent frameworks. But, first and foremost, what is React? On their website, they define it as a JavaScript library for creating user interfaces. So it's essentially a front-end framework. And the goal is to make it easier and faster to create beautiful user interfaces like those found on Airbnb. Then, one of the best things about React is how simple it is to create repetitive elements like the tiles you see on Airbnb. Each of these sections contains unique information.
However, each of them, such as the rating or the superhost tag, worked very similarly from listing to listing. So, if you have a lot of these to render, you can simply create a single component and customise it with different pieces of data to create an entire user interface like Airbnb's. In effect, you are reducing a very complex user interface structure to a component tree.
creating more appealing user interfaces It also significantly simplifies the structure of your website. So, if we go back to using Bootstrap to create a simple Navbar, we have to write a lot of HTML.
And it makes it difficult to organize our code and understand what's going on when things go wrong.
However, in React, we have a variety of different components, each of which is represented as an HTML element.
So it's almost as if we're creating our own custom HTML elements, each with its own styling and functionality. Then, like HTML elements, we can slot them into an overall structure, keeping the code for our web app incredibly clean, reusable, and modular. So these are all great things for writing clean code and building apps that scale well even when they become large and complex.
Effectively, think of these components as different ingredients that go into a burger, and depending on what you need, you can chop and change these components and customize the components. This is accomplished in part by combining different types of files. As a result, we've always tried to keep HTML, CSS, and JavaScript separate. But React does, and what it really benefits from is combining small amounts of each of these types of files into a single component, so that each component has its own styling and functionality that it controls, and you can create several of these components for each perform a different function and look different.
For example, this is what allows the Twitter website to load the feed screen while the rest of the page remains unchanged. The page will not update. Only when you reach the bottom of the feed does it detect that you've reached the bottom and send a request to the server to populate this feed component with more data, while the rest of your app remains unchanged.
This is also what allows websites to be so interactive. If you remember when we had Facebook and you had these requests, say friend requests or poke requests or whatever, you had to refresh the page to see the updates. But these days, everything is handled via notifications, with each component listening for changes in the server and updating itself, as well as its own appearance and data, and being able to communicate with the server independently.
Assume that each and every part of the Facebook website was its own component. As a result, the news feed is its own component, as are the posts. So, if there is a new comment, for example, on a post, that post must be updated without affecting the rest of the website. And this is one of the best aspects of the React framework. The other really cool thing it does is that it can re-render these changes very efficiently by comparing changes, which we might call diffing.
So whenever a change occurs, say a new piece of data arrives or the user does something, it will compare the new version of the DOM tree that you want to be rendered with the old version that is already showing up and it will do this kind of spot-the-difference thing where it finds that
And, obviously, this is more efficient, making your web app appear more interactive and much faster.
Of course, React isn't the only front-end framework available. So, why do we React?
Even looking at this Google Trends chart, which shows how frequently people search for each of these terms, you can see that React has clearly surpassed Angular and Vue over the last two years.
According to Stack Overflow polls, the most popular web framework is currently React JS, which is just below jQuery. But that's not all; React is used in a variety of places where you might want to work, such as Airbnb, Uber, Facebook, and Netflix. And it's probably one of the most rapidly growing and in-demand skills available.
Indeed, if you search for a job as a full-stack developer or frontend engineer, you will frequently see a requirement for React and Node, so what are you waiting for? Go get some react knowledge! Thank you for reading!
