Universal Login with custom UI

[stefan6]

Hi Auth0 Community,

I’ve recently started using Auth0 in my project with Universal Login and it’s working great.

However, one of our new requirements is to customise the login/signup experience in multiple steps and remove the redirect to Auth0 (I’ve attached a few placeholders at the end of the post but basically it’s username validation → password creation → email verification → success).

As I currently understand, there are three options available:

1. Customise the Universal Login page from the Auth0 dashboard using html/css (won’t work for my use case since I have multiple javascript checks I need to do, as well as involves redirecting)
2. Use embedded login (security issues and higher upkeep)
3. Use Classic Universal Login (no longer maintained)

I was wondering what the best practice and recommendation for this use case is.

Looking forward to your feedback,
Stefan

Placeholders:

[tyf]

Hey there @stefan6 welcome to the community!

@stefan6

However, one of our new requirements is to customise the login/signup experience in multiple steps and remove the redirect to Auth0 (I’ve attached a few placeholders at the end of the post but basically it’s username validation → password creation → email verification → success).

With the requirement of not redirecting to Auth0, your only option is an embedded approach. Good to know you are aware of the potential pitfalls there - Universal Login is strongly encouraged over embedded.

[stefan6]

Great, thanks for the reply. I had a follow up, Is there any guidance or example project of embedded login available? Could not find any examples

[tyf]

No problem, happy to help where I can!

There unfortunately isn’t much in the way of samples Which technology/framework are you using client side? Happy to take a look and see what I come up with.

[stefan6]

Thank you so much Ty that would be super helpful!

We are trying to implement it in Next.Js with next-auth, however using the next-auth framework is not a strong requirement for us. Any sample code would be of great help!

[tyf]

Happ to help where I can!

I think your best option will be to use Auth0.js which is our JS library for embedded login - I can’t really speak to the feasibility of implementing it with NextJS, but the page linked above does include an example of usage.