8. 8
    Override the Default Next.js Document
    4m 27s

Override the Default Next.js Document

InstructorLazar Nikolov

Share this video with your friends

Send Tweet

The Document is like the top level HTML structure of your Next.js application. By default it looks like this:

import { Html, Head, Main, NextScript } from 'next/document'

export default function Document() {
  return (
    <Html>
      <Head />
      <body>
        <Main />
        <NextScript />
      </body>
    </Html>
  )
}

As you can see it looks pretty close to an HTML document but with custom components instead of the native tags. Here, you can introduce custom behavior like fonts, scripts, icons, etc.