Styling active links in next.js is tricker than you think

How to style active links in Next.js App Router using the current page's pathname.
We'll walk through seeing how we can get the current page's path on the server by using Next.js middleware and setting a custom header, why that's probably not what you want to do in the first place, and how we can embed a client component in the page's server rendered layout to avoid opting an entire tree into client components.
🧰 Resources
Tutorial: spacejelly.dev...
Code: github.com/col...
Demo: my-sidebar-lin...
📺 KZbin: kzbin.info...
🐦 Twitter: / colbyfayock
📹 Twitch: / colbyfayock
✉️ Newsletter: www.colbyfayoc...
🎥 What I Use: www.colbyfayoc...
#colbyfayock #nextjs #webdevelopment