Password Resets in a MERN Application

Before I actually attempted to build in an email-based password reset for my MERN app, I thought it would be tougher to do. From everything I’d heard before, sending emails in a JavaScript application was painful, but I still wanted to attempt it.

For a few months, to hone my full stack JavaScript skills, I’ve been slowly building and adding on to a user registration service.

First, I built it with a React front end, an Express / Node.js backend and a Docker-powered MySQL database. I used a docker-compose.yml to start the whole app with one command (if you’d like to read more about my use of Docker for development, you can see this blog post).

After I’d gotten that working, I added in authorization to the app using Passport.js and JSON Web Tokens (JWTs). You can read about the fun (pain) of that here, if you’re curious. And it took me a while — I ran into a bunch of road blocks and obstacles that stalled me out multiple times. But grit and my inability to let go of a problem once it’s taken root in my brain prevailed, and I figured it out and moved on.

When I decided to tackle sending password reset links via email (just like real sites when users, myself included, inevitably forget their password), I figured I was in for more pain. It just couldn’t be too easy, no matter that practically every site out there has this very functionality. But I was wrong. And I’m so glad I was.

Nodemailer — The Magic Bullet

Once I started googling around looking for solutions to my password reset feature, I came across a number of articles recommending Nodemailer.

When I visited the website, the first lines I read were:

Nodemailer is a module for Node.js applications to allow easy as cake email sending. The project got started back in 2010 when there was no sane option to send email messages, today it is the solution most Node.js users turn to by default. — Nodemailer

And you know what? It wasn’t kidding. Easy as cake isn’t too far wrong.

Of course, before I got started, I did a little more digging to make sure I was placing my faith in a decent piece of technology, and what I saw on NPM and Github put my mind at ease.

Nodemailer has:

Over 615,000 weekly downloads from NPM,

Over 10,000 stars on Github,

206 releases to date,

Over 2,500 dependent packages,

And it’s been around in some form or fashion since 2010.

Ok, that seemed good enough for me to give it a shot in my own project.

Implementation of Nodemailer in my code (front and backend)

I didn’t need anything fancy for my password reset, just:

a way to send an email to a user’s address,

and that email would contain a link that would redirect them to a protected page on my site where they could reset their password,

and then they could log in using their new password.

I also wanted the password reset link to expire after a certain time period for better security.

Here’s how I did it.

Front End Code (Client Folder) — Send Reset Email

I’ll start with the React code first, because I had to have a page where users could enter their email addresses and fire off the email with the reset link.