Root <App> Component

Blitz uses the

App component in app/pages/_app.ts to initialize pages. You can modify it to do amazing things like:

  • Persisting layout between page changes
  • Keeping state when navigating pages
  • Custom error handling using componentDidCatch
  • Inject additional data into pages
  • Add global CSS

The default

_app.tsx file looks like this:

  1. // app/pages/_app.tsxexport default function App({Component, pageProps}) {  return <Component {...pageProps} />}

The

Component prop is the active page, so whenever you navigate between routes, Component will change to the new page. Therefore, any props you send to Component will be received by the page.

pageProps is an object with the initial props that were preloaded for your page by one of our data fetching methods like getStaticProps or getServerSideProps