Email Validation purely from frontend
Hello everyone,
If i have to implement an email verification service on submitting a form purely in next js, then what are the best ways to go about it?
5 Replies
Use a form validation library or regex
I am going to be using zod and regex for the input validation. Here i am talking about a service like email verification through link or otp to actually know that particular user is the one filling the form.
Basically sending a mail for confirmation
Resend · Email for developers
The best way to reach humans instead of spam folders. Deliver transactional and marketing emails at scale.
Thank you.
My first choice but not part of the question i asked.
For verifying an email, you shouldn’t do it purely on the frontend, for security and state management reasons. The flow for email verification traditionally is:
1. user clicks to verify email
2. A code is generated and stored somewhere, preferably a secure place like a db.
3. An email gets generated and sent with a link inside to something like
your-site.com/verify?code=<some verification code>. This can be a page or an API route, however way you want to do it.
4. The user clicks the link
5. Your route digests the verification code
6. In the db, code is marked as used and the email marked as verified.
7. The user gets redirected somewhere
For session based email verification, it’s relatively the same, but you’ll set the verified state in the session with an expiration however many minutes long in the future or make it one time use (requires some middleware/session state logic).
Email OTPs are similar, but without a link in the email. You’ll just place the generated numbers into the email.