The cool thing about Next.js API routes is that we can directly consume the API endpoints from pages.
SWR is a nice tool for handling data loading state in React apps using hooks, and is a perfect companion for our Next.js application. In this lesson, we will learn how to use SWR - a data fetching library by Zeit - to consume API endpoints on the client-side, and conditionally render an error or a loading component when the data is not available.