Blitz is in beta! 🎉 1.0 expected in May or June
Back to Documentation Menu

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} />

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

Idea for improving this page? Edit it on GitHub.