No authentication system is complete without a password reset feature. I would personally never ship a product that did not have this feature included. It is necessary to provide a way for users to recover access to their accounts/data in case of a lost or forgotten password. In this article, I will be demonstrating how to handle password resets in ExpressJS.

In the last 2 articles, I wrote about how to connect ExpressJS application to MongoDB database and building a user registration and authentication system.

Both of these articles tie into today’s article. …

In this article, I’m going to demonstrate how to build a user registration and authentication system in ExpressJS. In the previous article, we set up a MongoDB connection using Mongoose. Here we’ll be using that connection to save user data and use it for authentication.

This project is available on Github. Feel free to clone it if you’d like to follow along.

Setup

Let’s start by setting up the necessary packages and libraries for this portion of the project.

Run the following command to install the necessary package:

npm install passport passport-local express-session bcrypt connect-mongo express-flash joi

Here’s a breakdown of…

In the previous article, I demonstrated how to set up Nunjucks template engine in your express project. I decided to make this a full-fledged web app development series of articles by progressively building the example application. In this article, we are going to connect the app to a MongoDB database using Mongoose.

Mongoose is an ODM (Object Document Mapper) that allows interaction with MongoDB databases using JavaScript objects.

It provides extra functionality (such as static methods on the schema) that allows us to enhance database interactions and write cleaner code.

At the time of writing this article, the latest stable…

When building a web app without a dedicated front-end framework like ReactJS, Templating engines (e.g. Blade, Nunjucks) are incredibly useful.

Though they aren’t entirely necessary, they definitely help create more dynamic pages with cleaner HTML code.

Before getting into JavaScript, Flask and Django were my preferred choices for building web applications. Coming from that background, I got very used to the Jinja2 engine.

When I switched to using Express for web app development, I wanted a solution that would have similar syntax and features to Jinja2. Fortunately, Nunjucks is exactly that. …

Cron is a software utility that allows us to schedule tasks (cronjobs) to run periodically, at fixed times or at pre-determined intervals.

These tasks can serve any desired function. Some common applications include periodically backing up user data or calling an API endpoint.

In this article, I’m going to cover the basics of setting up and running cronjobs. Although I use a macOS (Mojave) system, the examples should work on Linux systems, provided all the necessary dependencies are installed.

If you are on a linux system, this article will assume you already have all the dependencies installed.

Displaying cronjobs

In order to…

There comes a time when we have to worry about more than just making sure our applications work, but that they work optimally. When using react, we have certain tools at our disposal to make sure our applications are optimised. In this article, I will demonstrate how to achieve this using React.memo and the useMemo hook.

Rendering

Before we dive into the use of these methods, let’s first establish a basic understanding of how react components are re-rendered.

Components in react will re-render when there is a change in their state and/or their props.

Child components will also re-render whenever their…

Recently, I was in a situation that required workbox integration for background sync in an application. After some trial, error and success, I decided to write this article to demonstrate the easiest way I’ve found to integrate workbox with create-react-app.

This article assumes basic knowledge of create-react-app, workbox and the react framework, as we will be using some terminology associated with these technologies. There’s no need to be a pro, beginner-level knowledge should suffice.

1. Update serviceWorker.js

The first step is updating the serviceWorker.js file within the src folder. We will be updating the register function. At the moment, it looks like this:

…

So you’ve created your react application and now you have to write end-to-end tests in order to make sure your application works as expected from the end user’s perspective. In this article, I will provide a simple step-by-step guide on how to achieve this using the Jest testing framework and the Puppeteer library.

This article will have the following structure:

1. Creating the app — The creation of a simple app that will be used in our testing demonstration.
2. Installing the packages — The installation of the packages we will need in order to achieve our goal.
3. Creating the custom environment…