User authentication with Node.js series: boilerplate
Tags: node, mongodb, react, 100daysofcode
Published: 2020-11-09 20:31:55

# Introduction



User authentication is the core feature of every website and mobile application. Writing authentication the correct and secure way prevents malicious users from accessing sensitive application data.

There are many technologies we can use to enforce secure access to application resources, the most common one is **OAuth**.

> You can read more about **OAuth** [here](https://oauth.net/2/).


But, for this series, we will build the authentication system from scratch, and make it as simple as possible so it can be further customized and *“plugged”* with any existing application.    

---



# Prerequisites

To ensure a smooth and pleasant experience, please make sure before cloning the starter repository to have the following tools installed:

 - latest version of [Node.js](https://nodejs.org/en/)
 - latest version of [npm](https://www.npmjs.com/)
 - git 
 - Text editor 
 - Terminal

---

# Project repository

In this section, we will clone the starter project hosted on  [Github](https://github.com/2imad/node-js-authentication), get familiar with the folder structure, and explore the project dependencies.


1. **Open a Terminal session and run**
> 
```bash
git clone https://github.com/2imad/node-js-authentication.git
cd node-js-authentication
``` 
1. **Install server dependencies**
>```bash
npm install
```
1. **Install client dependencies**
>```bash
cd client
npm install && cd ..
```
1. **Git checkout *boilerplate* branch**
>```bash
git checkout boilerplate
```
1. **Open the project with your favorite text editor, at this stage it should look like this:**
> ```bash
|-- node-js-authentication
    |-- config
    |-- db
    |-- mailer
    |-- middlewares
    |-- routes
    |-- .env
    |-- .gitignore
    |-- index.js
    |-- LICENSE
    |-- package-lock.json
    |-- package.json
    |-- README.md
    |-- client
    |   |-- .gitignore
    |   |-- package-lock.json
    |   |-- package.json
    |   |-- README.md
    |   |-- public
    |   |   |-- favicon.ico
    |   |   |-- index.html
    |   |   |-- logo192.png
    |   |   |-- logo512.png
    |   |   |-- manifest.json
    |   |   |-- robots.txt
    |   |-- src
    |       |-- App.css
    |       |-- App.js
    |       |-- App.test.js
    |       |-- index.css
    |       |-- index.js
    |       |-- logo.svg
    |       |-- reportWebVitals.js
    |       |-- setupTests.js
```
1. **Start the development server**
>```bash
npm run server
```
If you see output like below, it means you are ready to roll :) 
>```bash
[nodemon] 2.0.6
[nodemon] to restart at any time, enter `rs`
[nodemon] watching path(s): *.*
[nodemon] watching extensions: js,mjs,json  
[nodemon] starting `node index.js`
Listening on 8000
```
---


# Project dependencies
Here is the current dependency list as found on ***package.json***. 
With each list item, you find a link to the package homepage on ***npm*** and a brief introduction. 
   
- [bcrypt](https://www.npmjs.com/package/bcrypt)
bcrypt is a powerful hashing function, we will make use of its power to add hashing and salting to user passwords.
- [concurrently](https://www.npmjs.com/package/concurrently)
This package enables running multiple commands simultaneously.
- [cors](https://www.npmjs.com/package/cors)
Cross-Origin Resource Sharing (CORS) is an HTTP-header based mechanism that allows a server to indicate any other origins (domain, protocol, or port) than its own from which a browser should permit loading of resources. CORS also relies on a mechanism by which browsers make a “preflight” request to the server hosting the cross-origin resource, in order to check that the server will permit the actual request. In that preflight, the browser sends headers that indicate the HTTP method and headers that will be used in the actual request.
During development, our client and server are both running on ***localhost***. Most browsers deny cross-origin requests for security reasons, but ***Cors*** will help us get around that.
- [dotenv](https://www.npmjs.com/package/dotenv)
This package enables retrieving environment variables stored in the **.env** file and using them without risking sensitive data exposure.
> ***Important note:***
   ***.dotenv*** file should always be included in ***.gitignore*** before committing the code.
- [express](https://www.npmjs.com/package/express)
express is the module we are using to create a server and configure authentication routes.  
- [jsonwebtoken](https://www.npmjs.com/package/jsonwebtoken)
JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with the HMAC algorithm) or a public/private key pair using RSA or ECDSA.  - [source](https://jwt.io/introduction/).
- [mongoose](https://mongoosejs.com/)
Mongoose provides a straight-forward, schema-based solution to model our application data. It includes built-in type casting, validation, query building, business logic hooks, and more, out of the box. 
- [nodemailer](https://nodemailer.com/about/)
Nodemailer is a module for Node.js applications to allow easy email sending.
- [validator](A library of string validators and sanitizers.)
This library validates and sanitizes strings.

---
# Resources
Finally, some additional resources to help you understand the functionality of each dependency we are using in the project, in case you know any other resources, please do let me know!
- [bcrypt](https://www.npmjs.com/package/bcrypt)
> Article:[Hashing in action](https://auth0.com/blog/hashing-in-action-understanding-bcrypt/)   
NPM: [bcrypt](https://www.npmjs.com/package/bcrypt)   
Playground: [bcrypt generator](https://bcrypt-generator.com/).

- [cors](https://www.npmjs.com/package/cors)
> Article: [MDN](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS)   
 Definition: [W3C](https://www.w3.org/wiki/CORS_Enabled)   
 Article: [What is Cors](https://auth0.com/blog/cors-tutorial-a-guide-to-cross-origin-resource-sharing/)

- [express](https://www.npmjs.com/package/express)
> Homepage: [Express](https://expressjs.com/)   
 NPM: [express](https://www.npmjs.com/package/express)   
 Article: [MDN](https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/Introduction).

- [jsonwebtoken](https://www.npmjs.com/package/jsonwebtoken)
> Homepage: [jwt](https://jwt.io/)   
Playground: [jwt](https://www.jsonwebtoken.io/)   
Source code: [jwt](https://github.com/auth0/node-jsonwebtoken)

- [mongoose](https://mongoosejs.com/)
> Homepage:  [mongoose](https://mongoosejs.com/)   
NPM: [mongoose](https://www.npmjs.com/package/mongoose)   
Tutorial:[MDN](https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/mongoose)

- [nodemailer](https://nodemailer.com/about/)
> Homepage:[Nodemailer](https://nodemailer.com/about/)
Full tutorial:[Nodemailer](https://blog.mailtrap.io/sending-emails-with-nodemailer/)

---
# Conclusion

In this first part of the series, we talked about authentication with Node.js, cloned the starter repository, and installed the dependencies. Hopefully, you are as excited as I am to get to the next chapter where we will create a **MongoDB** database and connect it to our project with **mongoose**, and finally create the **signup**  route.

The next chapter should appear soon, so stay tuned! or follow me and receive it immediately in your mailbox  :) 




Cheers! 

IYO   
***Bemoore***