In this video we are going to see all the changes that happened in the Next.js Router between all the 9.x versions up to version 10.

We will see that the router is now case sensitive and we no longer need to use the “as” property in the Link component.

At the end of the video I’ll also show how to ignore some files in the pages folder, to avoid primarily creating new pages for the unit test files.

In the past I showed you that you could create a container folder to match your pages folder structure and only export your components in the pages folder. That way you would not open new routes for every single unit test file named “file.spec.js”. For that we will be using next.config.js with “pageExtensions” property.

GitHub Repository: https://github.com/bmvantunes/youtube-2020-nov-nextjs-router

next.config.js default values: https://github.com/vercel/next.js/blob/canary/packages/next/next-server/server/config.ts#L23

Next.js Link API Reference: https://nextjs.org/docs/api-reference/next/link

Timeline:

• 00:00 Introduction
• 01:21 Case Sensitive Routing
• 03:20 Link without “as” prop for dynamic routes
• 05:28 Having unit-tests (file.spec.js) in page folder without creating new routes

#next #react #javascript #web-development #developer