Using the router to detect the active link in Next.js
When working with links in Next.js, it’s important to determine the current URL and assign a class to the active link so that it can be styled differently. This is particularly useful in the site header. Unfortunately, the default Link component provided by next/link doesn’t handle this automatically. However, there are two techniques that we can use to achieve this behavior. The first technique is to add the logic to the children of the Link component....