Mod-3-pre-work.md

1. The "data model" is how we organize our data and logic for an application. The DOM is how we display and allow users to interact with that information. It's important to keep these things separate because while the DOM is malleable, it can cause errors within the data model if they are too closely linked. The data model is often refered to as the "one hard truth". If you think of it as a blueprint and the DOM as the actual building - it's important that the data model always knows how an elevator should work so that if the actual elevator breaks down it won't also destroy the blueprint by which we'll fix it.
2. Frameworks and libraries differ primarily in which calls what. Frameworks make calls on your code and your code makes calls to libraries.
3. Frameworks are useful because they can keep track of "states" on the DOM. This means we can write less logic (and have stronger, less breakable code) because while the Framework takes care of that for us, it also provides us with tools that vanilla JS doesn't have.
4. A component in react is a sort of super class which allows us to use DOM methods that interact with and keep track of what's happening on the DOM. Components can interact with child elements and the state of the DOM over time. This allows us to manipulate specific aspects of the DOM much faster, while also manipulate the DOM in response to changes as they happen (for instance, each time the value of an input changes, the DOM can re-rendeer). They are used to split the UI into peices, in a way, introducing encapsulation to CSS and HTML.
5. JSX is Javascript with xHTML tags and abilities. While React can handle any javascript it uses, it can also read javascript within HTML. This allows us to embed logic into DOM elements, React compiles JSX into objects to create elements.
6. props is a keyword stands for properties (similar to properies in an object); they are used to pass data between components (from parent to child).
7. React state objects are changeable properties within a component. Components will re-render when a state changes. States don't get passed to children, but they are managed by parent components.
8. In React, "data down" refers to the fact that data is passed down from parent components and the children should only be able to read that data (props). "Actions up" refers to state objects within a parent handling the actions of that parent and its children.