Now on our form, we can type in items but we don’t really have a list yet. Now inside of InputForm.js, we have a handle to this method as props.handleItemInput. This is how props are passed down to children components. You’ll notice that on our InputForm component in App.js we changed onClick to handleItemInput. const M圜omponent = (props) => from 'react' These are simple functions that return JSX and receive properties (props). These components are reusable and composable and can manage their own private state. React describes the virtual DOM using components using JSX which is sort of a hybrid of Javascript and HTML. It will hold a virtual view in memory and only re-renders particular parts of the virtual DOM through the state when it is needed instead of re-rendering the entire page every time. We describe how we want the interface to look and React takes care of the how. React uses something called a Virtual DOM. Now a little background on React… VIRTUAL DOM Once you have this installed, open chrome dev tools and you should see a tab labeled “React.” This is where you can inspect your React components and it makes debugging a lot easier. Now one last step before we dive into the code and that is to install React Developer Tools which you can grab here.

Create todolist react natice