Next.js Guide

Next.js Authentication

Add production-ready authentication to your Next.js app in 5 minutes. Pre-built sign-in forms, protected routes, middleware, and multi-org support.

Why GitHat for Next.js

Adding auth to Next.js shouldn't take days. GitHat ships pre-built React components, edge middleware for route protection, and automatic token refresh — all optimized for the App Router.

Quick Setup

Three steps: `npm install @githat/nextjs`, wrap your app in GitHatProvider with your publishable key, and drop SignInForm/SignUpForm into your auth pages. Protected routes work automatically via middleware.

Features Included

Everything you need: sign-in/sign-up forms, user menu, org switcher, route guards, auth hooks, token management, email verification, password reset, and a polished dark UI — all from one package.

Install

npm install @githat/nextjs

Example

// app/layout.tsx
import { GitHatProvider } from '@githat/nextjs';
import '@githat/nextjs/styles';

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        <GitHatProvider config={{
          publishableKey: process.env.NEXT_PUBLIC_GITHAT_KEY,
          afterSignInUrl: '/dashboard',
        }}>
          {children}
        </GitHatProvider>
      </body>
    </html>
  );
}
Try GitHat free

Ship authenticated apps in minutes, not weeks.

Related