Module 6 Summary
This lesson summarizes our addition of the Context API and useContext Hooks in Module 6.0.
Get the project source code below, and follow along with the lesson material.
Download Project Source CodeTo set up the project on your local machine, please follow the directions provided in the README.md file. If you run into any issues with running the project source code, then feel free to reach out to the author in the course's Discord channel.
This lesson preview is part of the The newline Guide to Modernizing an Enterprise React App course and can be unlocked immediately with a \newline Pro subscription or a single-time purchase. Already have access to this course? Log in here.
Get unlimited access to The newline Guide to Modernizing an Enterprise React App, plus 70+ \newline books, guides and courses with the \newline Pro subscription.
[00:00 - 00:11] This lesson is a summary of what we have covered in module 6. In this module, we learned where the context API can be useful to avoid passing props.
[00:12 - 00:35] When props are passed more than a few levels through components, it's probably a good idea to think about employing the context API instead to avoid unnecessary complexity and components that don't need those props themselves. We learned not only how to set up a context object provider, but also how to add used context hooks to multiple components consuming the values from that provider.
[00:36 - 00:44] We learned how to create multiple contexts nested within other components. Contexts don't just have to live at the top level of a component to work.
[00:45 - 01:00] In fact, all the provider has to wrap is the JSX of the child components that will need to access its state and nothing else. Not only that, but these contexts can be used to access both functions and values from parents with no problem.
[01:01 - 01:05] Need to change a value from a child in the parent? Context functions can handle it.
[01:06 - 01:14] Our next module is going to be unit testing our app. So automated testing is an important part of any enterprise level of React application.
[01:15 - 01:28] It's an expectation nowadays, not an exception. And there is no better way to give us a sense of security that our refactoring or new feature additions haven't broken any existing functionality in our app than with automated tests.
[01:29 - 01:47] With the advent of React hooks, the accepted unit testing library combination of just and enzyme was forsaken in favor of just and react testing library, which took a very different approach to testing. An approach, which in my opinion, makes a lot more sense when you wrap your head around it.
[01:48 - 02:04] In the next module, we'll get our first look at React testing library's testing philosophy, how to set up our app to run unit tests and generate code coverage reports with a few simple NPM commands, and how to test React components using hooks, as well as React custom hooks themselves.