- [Instructor] To understand component lifecycles it's first easier to look at class components. This is because the component lifecycle methods are built into them, we just override their implementation. The class component clock we are showing demonstrates how we can use a class component state and its lifecycle methods to display a ticking clock on the screen. Most obvious lifecycle method is the constructor, this is a mounting method in the render phase and it sets up the components props if it has any and its initial state. Once the initial render has completed if a component did mount method exists in the class this will be called... traditionally this is where we would have operated on the dome or made calls for external data as the component would have rendered. We could then get database synchronously and update state when it has been returned. The component did mount method in our code is used to set an interval running and this calls a method tick every second tick updates the time state within new value. This continues while the component is alive and you can see the clock updating in the browser. When a component has updated, if a component did update method exists this will be executed. This must have PrevProps as an argument and can obviously have PrevState and snapshot too. Again, this can be used to operate on the dominant make network calls for data. The advantage here is that you can use a conditional statement based on the previous props previous state or the snapshot to decide if this needs to happen. If you're going to set state in this method it must be wrapped in a conditional statement to prevent an infinite loop. The component did update method was not required in this application, but we included a blank implementation for completeness. The final life cycle method we're looking at is the component will amount method. If present is what we call it just before the component is completely removed from the dome it gives us a chance to do any cleanup we need to by unsubscribing clearing timers and so on. When we come to a mount in the class component clock we would want to clear the interval. So the process doesn't continue to hog resources. This is done in the component will amount method shown.