Q8: What is pages/_app.js used for in the Pages Router?
pages/_app.js initializes all pages. Use it to persist layouts across page changes, inject global CSS, maintain state across navigations (e.g., Redux or React Context providers), and handle global error tracking.
Custom _app.js Implementation
// pages/_app.js
import '../styles/globals.css';
export default function MyApp({ Component, pageProps }) {
return (
<Layout>
<Component {...pageProps} />
</Layout>
);
}💡 Component represents the active page; pageProps contains pre-fetched props from data methods.
Key Takeaways
- Wraps every page component in the application.
- Used for importing global CSS and configuring context providers.
Knowledge Check
Which prop in pages/_app.js represents the current active page component being rendered?