Questions

1. What does a component’s lifecycle refer to? The standard order by which the browser reads and executes code to render a page.
2. Why do you sometimes need to “wrap” functions in useCallback when called from within useEffect to keep things within the proper scope?
3. Why are functional components preferred over class components? has the benefits with less verbose language requirements and a more natural integration into serverless design

4. What is wrong with the following code?

            import React, {useState, useEffect} from 'react';
   
            function MyComponent(props) {
            const [count, setCount] = useState(0);
   
            function changeCount(e) {
                setCount(e.target.value);
            }
   
            let renderedItems = []
   
            for (let i = 0; i < count; i++) {
                useEffect( () => {
                console.log('component mount/update');
                }, [count]);
   
                renderedItems.push(<div key={i}>Item</div>);
            }
   
            return (<div>
                <input type='number' value={count} onChange={changeCount}/>
                {renderedItems}
                </div>);
            }
   

the onChange needs to be passed the event object

Vocab

state hook - built in method for creating a state logic effect hook - built in method for hooking into the lifecycle reducer hook - like useState, but can accept a callback to calculate out a single value (or thing)

Preview

Which 3 things had you heard about previously and now have better clarity on? useReducer, useEffect, useState Which 3 things are you hoping to learn more about in the upcoming lecture/demo? building hooks, using reducer What are you most excited about trying to implement or see how it works? getting the hooks to feel natural and not somewhat magic.