Back to Better Auth

Next.js Example

docs/content/docs/examples/next-js.mdx

1.6.151.7 KB
Original Source

This is an example of how to use Better Auth with Next.

Implements the following features: Email & Password . Social Sign-in . Passkeys . Email Verification . Password Reset . Two Factor Authentication . Profile Update . Session Management . Organization, Members and Roles

See Demo

<ForkButton url="better-auth/better-auth/tree/main/demo/nextjs" /> <iframe src="https://stackblitz.com/github/better-auth/better-auth/tree/main/demo/nextjs?codemirror=1&fontsize=14&hidenavigation=1&runonclick=1&hidedevtools=1" style={{ width: "100%", height: "500px", border: 0, borderRadius: "4px", overflow: "hidden" }} title="Better Auth Next.js Example" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts" />

How to run

  1. Clone the code sandbox (or the repo) and open it in your code editor
  2. Move .env.example to .env and provide necessary variables
  3. Run the following commands
    bash
    pnpm install
    pnpm dev
    
  4. Open the browser and navigate to http://localhost:3000

SSO Login Example

For this example, we utilize DummyIDP. Initiate the login from the DummyIDP login, click "Proceed", and from here it will direct you to user's dashboard.

SCIM Sync Example

For this example, we utilize DummyIDP. Head out to the IDP dashboard and try to add, update or remove users, then go to the admin page or directly to your database and watch the synchronization work.