Security - Authentication Workflows

Sun, 05 Feb 2023 00:00:00 +0000

Here are three scenarios for implementing authentication workflows.

Internet Applications (Public facing)

For internet web applications and APIs, Session based (SessionID cookie) and Token Based (JWT) Authentication can be implemented.

Session Based: Implemented for a majority of traditional and stateful web applications. Once the user is authenticated, A Session state is created and stored in an external State server or SQL database. The Session state is identified by a unique SessionID. This SessionID is returned to the client and set as a cookie using Set-Cookie: sessionid=38askse24d56dh43hrs7a8; HttpOnly; Path=/.

Using React Hooks - useState and useEffect

Tue, 15 Mar 2022 00:00:00 +0000

With the release of Hooks in React 16.8, it is now possible to store state in a function. We can add react features like useState and useEffect into the function directly without needing to create class.

useState

The useState hook adds state to the functional components. useState hook allows you to declare one state variable at a time.

import React, { useState } from 'react';

function Counter() {
  //Declare the "counter" state variable
  const [counter, setCounter] = useState(0);

  return (
      <div>
        <p>Clicked {counter} times</p>

        //increment the counter by 1 on every click
        <button onClick={() => setCounter(counter + 1)}>Click here</button>
      </div>
  );
}

useEffect

The useEffect allows to manage side effects in a functional component. Some of the examples are fetching external data using api, manipulating DOM in react. It is similar to componentDidMount and componentDidUpdate from class component.

Development on David Lang

Security - Authentication Workflows

Internet Applications (Public facing)

Using React Hooks - useState and useEffect

useState

useEffect