codelynx.dev
🇫🇷🇬🇧

Back 08/01/2024

NextAuth VS BetterAuth: Which authentication to use with NextJS

Written by Melvyn Malherbe on 08/01/2024


AuthJS (formerly NextAuth) is the most popular library for managing authentication in NextJS applications.

However, it's not the only solution, and I recently migrated all my applications to Better-Auth, which I promise, once tested, will make you use it for life.

Each heading will compare a feature that made me switch.

Installation and setup

With Better-Auth, installation is very simple. Just follow their tutorial and install each library.

What's magical is that to manage your database, they provide a CLI that automatically updates your schema. For example, when you set up Prisma:

TSX
import { betterAuth } from 'better-auth';
import { prismaAdapter } from 'better-auth/adapters/prisma';
import { PrismaClient } from '~/generated/client';

const prisma = new PrismaClient();
export const auth = betterAuth({
  database: prismaAdapter(prisma, {
    provider: 'sqlite', // or "mysql", "postgresql", ...etc
  }),
});

Then you just need to run npx @better-auth/cli generate for Better-Auth to automatically update your Prisma schema with the new data.

Why this CLI? Because Better-Auth offers plugins, and for example, by adding the username plugin, you can run the command again so it automatically adds the username fields in Prisma.

This offers a much more pleasant developer experience.

Email / Password

With AuthJS, email and password was a real hassle to set up, to the point where you had to write your own code to do it as I explain in my article on the subject.

With Better-Auth, you just need to add this:

TSX
import { betterAuth } from 'better-auth';

export const auth = betterAuth({
  emailAndPassword: {
    enabled: true,
  },
});

And that's it, you can already start testing.

Client DX

To interact with Better-Auth, you have what they call the "client" which can be called client-side and allows you to interact with Better-Auth. For example, for signUp:

TSX
authClient.signUp.email({
  email: values.email,
  password: values.password,
  name: values.name,
  image: values.image,
});

Just by making this command, you've created a new user with email and password. It automatically handles cookie setup, password hashing, etc.

Advanced Features

Do you need Reset Password? Email Verification or even Social Login?

You can manage everything with the configuration, and the documentation is very well explained. For example, to reset the password, you add this to your auth.ts config:

TSX
import { betterAuth } from 'better-auth';

export const auth = betterAuth({
  emailAndPassword: {
    enabled: true,
    async sendResetPassword({ user, url }) {
      await sendEmail({
        to: user.email,
        subject: 'Reset your password',
        text: `Hello, click here to reset your password: ${url}`,
      });
    },
  },
});

Just by doing this, we've activated password reset. Then you just need to call the client methods:

TSX
authClient.forgetPassword({
  email: values.email,
  redirectTo: '/auth/reset-password',
});

Create a page /auth/reset-password that retrieves the token and the new password and updates it with this method:

TSX
authClient.resetPassword({
  token: token,
  newPassword: values.password,
});

Too simple to be true? Yes. It's really fantastic.

To clarify, AuthJS simply had none of these features:

  • Verify email = ❌
  • Reset Password = ❌
  • Change email = ❌

So it's incomparable because with Better-Auth you can do everything simply.

Plugins and customization

Better-Auth was created with a system that can have as many plugins as you want to do everything. The community can create plugins, and Better-Auth also creates super plugins like Organization and Stripe.

The documentation is great and it's simple to set up.

With this, you can have an organization, manage permissions, and roles very simply.

I've set up all this in NOW.TS for you, and it does it with very little code.

Personally, I'm a total fan of this system, and it allows you to do an infinite number of things.

Conclusion

I haven't even talked about how AuthJS is poor in features. It's like comparing an old Nokia 3310 to an iPhone.

The iPhone can do everything; you can install applications, while Nokia can just... make phone calls.

In fact, the only use of NextAuth is for social sign-in and magic link. Everything else is impossible, and you have to do everything manually, down to the session token management.

In summary, I strongly advise against using NextAuth.

And I highly recommend using Better-Auth.

You can find a FullStack course here.