1.5.1. JWT Authentication

• Create user model with password hashing.

To implement JWT authentication, the first step is to create a user model. This model defines how user data will be structured in the database. One critical aspect of this user model is password hashing, which is a process that converts a plain text password into an encoded format. This way, even if the database is compromised, the actual passwords remain secure. To hash the password, you can use libraries like bcrypt, which provide secure methods for hashing and verifying passwords.

Think of creating a user model like building a secure locker for valuables. The locker has compartments (fields) for each item (username, email, hashed password), and once you put your valuables inside, they cannot be accessed directly unless you have the key (the hashing process ensures that your valuables are locked away safely, even if someone peeks inside the locker.

• Implement routes for user registration and login, generating JWTs upon successful login.

After creating the user model, you need to set up routes that handle user registration and login. The registration route typically takes user details (like username and password), creates a new user entry in the database, and saves the hashed password. The login route checks entered credentials against what is stored in the database. If the credentials match, a JSON Web Token (JWT) is generated and returned to the user. This token serves as a temporary key that allows access to protected routes without re-entering the username and password multiple times.

Consider the JWT as a backstage pass at a concert. When you show your ticket (your login credentials) at the entrance, you receive a pass (the JWT). You can move around backstage (access protected routes of the application) without having to show your ticket again. However, the pass has an expiration time, meaning it will eventually expire, and you'll need to get a new one by logging in again.

• Store JWTs in localStorage or cookies.

Once the client (usually a web browser) receives the JWT from the server after a successful login, it needs to store this token securely. You can use localStorage or cookies for this purpose. LocalStorage allows you to store data in a key-value format that persists across browser sessions unless explicitly cleared. Cookies can also store JWTs but have certain attributes like expiration and domain that can control when and where the cookie is sent in requests, potentially adding more security.

You can think of storing the JWT like getting a membership card for a gym. You store the card in your wallet (localStorage) or in your gym bag (cookies). Whenever you want to work out, you simply show the card to gain access (using the JWT to authorize your requests). If someone steals your wallet, they can access your gym membership, just as if localStorage is compromised, someone can also access your authenticated session.

• Use JWTs for protected routes and making authenticated requests to the API.

In a web application, some routes (URLs) should only be accessible to authenticated users. To achieve this, the application checks for a valid JWT before granting access to these protected routes. If the JWT is valid and not expired, the user is allowed through; if it is missing or invalid, access is denied. This mechanism ensures that sensitive areas of the app, like user profiles or admin dashboards, are only accessed by those who are correctly authenticated.

Imagine a VIP lounge in a club. Only individuals with special wristbands (valid JWTs) can enter. At the entrance, a bouncer checks the wristbands. If you have a valid wristband, you can enter; if not, you're turned away. This is how protected routes work; only users with the correct authentication can access certain parts of your application.

--