1. mount something to the DOM...say a `div` called `App` that says 'hello world'
2. create component the 'other way'
3. create a component CLASS for `App`
4. add jsx to `App` component class, explaing what jsx is and why we use it. (also virtual dom reference).
5. create a `Header` component and add to `App` (explain `functional stateless components` here)
6. in `app.js`, introduce state via 3 items within state. also add `itemSelected()` fn.
7. create 'Siderbar' component and explore, explaining props, and state. (`itemSelected() should only console.log() something at this point!`)
8. in `sidebar` component explain JS in JSX via `{}`, and 'item' component as well. (NO PROPTYPES YET!)
9. via item component, explain `keys`, then go into component and show how the function `itemSelected()`, passed as a prop, is used. also explain `synthetic events`.
10. go back to `itemSelected()` and change it so it updates state.
11. create `FeaturedItem` component, pass in `featuredItem` state as a prop and demo...`handleChange()` should already exist, but be console.logging the updated value.
12. create `editReview()`, pass in as a prop and use in `handleChange()`.
13. create `removeReview()`, pass in as a prop and use.
14. create `AddForm` component (`AddReview()` shouldnt exist yet), explain `refs` and the `htmlFor` attribute and `addChipReview()` should only be console.logging the added review object
15. add `AddReview()` to `AddForm` component to update state.
16. introduce life cycle hooks with react docs and `componentDidMount()` in `App.js`, setting state to `sample-reviews.json` within it.
17. persist data with firebase.