DEV Community

Hari Manoj
Hari Manoj

Posted on

Microsoft Login for Next.js That Actually Works (Finally)

If you've added Microsoft login to a Next.js App Router project, you know the drill: hours of MSAL docs, client/server boundary issues, and debugging token renewals.

@chemmangat/msal-next is a production-ready wrapper that gives you Azure AD authentication in minutes, not days.


Independent AI Audit

This package was submitted for honest, unbiased reviews across three leading AI models:

Reviewer Score
DeepSeek 8.5 / 10
ChatGPT 8.0 / 10
Claude 7.5 / 10

No prompt engineering. No leading questions. Just the code and the docs.


Setup

One command scaffolds your entire auth setup:

npx @chemmangat/msal-next-cli init
Enter fullscreen mode Exit fullscreen mode

It creates your .env.local, wraps your layout with MSALProvider, and generates a starter auth page. You're two steps away from a working sign-in button.


What's Included

This isn't just a login button. It's a complete auth toolkit built for the App Router:

  • Zero-config components — drop in <MicrosoftSignInButton> and you're done
  • HooksuseMsalAuth(), useUserProfile(), useRoles()
  • Multi-tenant and multi-account support — available from v5.1.0
  • Route protection — via HOCs, guards, or Edge middleware
  • Server component support — use getServerSession() where you need it

Installation

npm install @chemmangat/msal-next @azure/msal-browser @azure/msal-react
Enter fullscreen mode Exit fullscreen mode

View the full documentation on GitHub →

Top comments (0)