author avatar


Mon May 27 2024

Key difference between App router and Page router :

App Router:File-based routing: Uses nested folders to define routes. • Components: Server Components by default. • Data fetching: Uses fetch function. • Layouts: Can be nested and dynamic. • Dynamic routes: Supported, but syntax differs. • Client-side navigation: Supported with router.push. • Priority: Takes precedence over Page Router. Page Router:File-based routing: Files directly represent routes. • Components: Client Components by default. • Data fetching: Uses getServerSideProps, getStaticProps, getInitialProps. • Layouts: Static. • Dynamic routes: Supported. • Client-side navigation: Supported with Link component. • Priority: Fallback if no matching route in App Router. #javascript #nextjs