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:

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


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

Idea for improving this page?Edit it on GitHub
Bytes Newsletter