- have fewer rules
- As a developer we call on libraries to utilize pre-written code that can be used over again repeatedly.
- Libraries are a collection of class definitions designed with code reuseability in mind.
- have more rigid rules
- Follow the "Hollywood Principle" — "Don't call us, we'll call you!"
- A Framework calls on a developer's code, and contains all libraries and NOT the other way around.
- In framework, all the control flow is already there, and there are a bunch of predefined white spots that we should fill out with our code.
- A framework defines a skeleton where the application defines its own features to fill out the skeleton. In this way, your code will be called by the framework.
- Modern Frameworks like React, allow the UI to be in sync at all times with changes made to the application.
- Designing and maintaining an APP that has continual state changes that need to be shown/updated in the DOM is rather difficult and expensive when using just vanilla JS.
- A major benefit is having a virtual DOM that makes comparrisons to the real DOM, and renders only the changes that differ between the virtual DOM and the real DOM:
- Some user event which changes the state of your app → Re-render virtual DOM → Diff previous virtual DOM with new virtual DOM → Only update real DOM with necessary changes.
- Components are the building blocks of React.
- Components are essentially widgets or modules…
- PROPS — The data which is passed to the child component from the parent component.
- Components let you split the UI into independent, reusable pieces, and think about each piece in isolation.
- STATE — The internal data store (object) of a component.
- How to maintain and change data within an application.
- Neither parent nor child components can know if a certain component is stateful or stateless, and they shouldn’t care whether it is defined as a function or a class.
- This is why state is often called local or encapsulated. It is not accessible to any component other than the one that owns and sets it.
- A component may choose to pass its state down as props to its child components:
