Email and Password in separate screens

I want to create a longer onboarding process for my users. I want the user to enter there email in the first screen and then enter there password in the second screen. In another screen I will get them to add more profile information but that workflow is easy because I’ll just update the user details! How do I do this? I can’t seem to link the two properly.

Hey mate, how are you?

You can store the email in a state and then once they put in the password, you can log them in or create account

Not sure I get what you mean? Mind explaining in detail?

For sure. So I take it you are wanting the person to put in there email and then move to the next screen and put in a password, then either sign up or login… then go through onboarding?

If that is the case, you can have them put in the email, store the email in a state and then move to the password screen. Once they put in the password you can sign them up as a user or login them in and then move to the onboarding screen.

When signing up or logging in, you would refer to the state for their email rather than the input.

You’re right about what I’m trying to do but I’m struggling to understand what you mean by storing the email in a state. Do you mean I would just let the user click next and the workflow would be to go to the next screen but the data to send would be the email input field?

Are both these screens on the one page?

No they are separate pages. The email is one page, then when the user clicks next they are taken to the password page.

Mmmm ok, I would set up your whole onboarding process on the one page but have different screens that show or hide with states as this would run much cleaner and smoother. Once onboarding is finished then you can move to another page.

If you don’t want to do that, you can send the persons email as a parameter in the URL and then once they put in the password you can pull the email from the URL.

1 Like

Ah the hide and show idea is actually much better. I’m going to try that and get back with results

Awesome mate, if you run into any problems feel free to DM me :slight_smile:

Amazing. It worked nicely. I created the pages in groups in one page and the second group was hidden on page load. When a user hits next in the first group, it would hide and the next group would show. Then when the user hits next in the second group it would sign the user up. Worked perfectly! Thanks for that idea man!

Perfect mate <3 Happy to help :slight_smile:

This topic was automatically closed after 70 days. New replies are no longer allowed.