React is a library for creating user interfaces. It's focused on the view and how an interface hooks connects to those other elements. What makes React really different is that it completely takes care of managing the DOM for you. It does this by using something called the Virtual DOM. Unlike other frameworks, you do everything in react by working with Components instead of Models, views, and controllers. Another thing that makes React unique is the One day data flow structure.
- [Voiceover] Before we get started it would be a good idea to talk about what React is, and how it's different from other frameworks and libraries. React is a library for creating user interfaces and that means that it's not necessarily concerned with the whole process of creating an application. So it's not so much about the data or the controllers, it's really just about the view. It's simply focused on the view and how an interface connects to those other elements. What makes React really different is that it completely takes care of managing the DOM for you.
Now this is like what you do when you write something in HTML. You create a tag and then you insert other sub-tags inside that main tag. Another thing that makes react unique is the one-way data flow structure. In Angular One and other frameworks, you create a two-way relationship between the model and the view. React can do the same things but keep the flow of data going one way. Now the reason that's good is because you end up managing everything through the main component state. The main component stores information about what's going on with your application and sub-components and what this framework does is quote, unquote react to changes in that information.
If something changes in your State or in your data, then React with re-render the DOM for you automatically. All you have to worry about is what happens to your data. The main component passes information to sub-components via something called Props, or properties. Think of them as properties in an HTML tag, like the anchor tag has an HREF tag and tags like image require you to have like a source attribute. Props, or properties, can both pass information down to sub-modules but also trigger actions in the main module.
- Using components and subcomponents
- Working with state
- Handling events
- Creating subcomponents
- Using references
- Sorting and updating views, events, and search results