Set up Chakra UI to work with Next.js

In this lesson, we will learn how to set up and use Chakra UI with Next.js.

We'll use Chakra UI to customize the way Next.js styles every page in our application by defining a _app.tsx file. We'll wrap our app in the ThemeProvider that Chakra gives us as well as use CSSReset to reset the default browser styling.

After this initial set up, you'll see how easy it is to start styling pages with Chakra by using components like Heading, Link, and Flex exposed from the core package.