DEV Community: Harshavardhan

JWT Authentication Tutorial with Node JS

Harshavardhan — Tue, 28 Dec 2021 16:45:56 +0000

JWT stands for JSON WEB TOKEN.
JWTs are great way to implement authentication. It is a standard that defines a compact and self-contained way to securely transmit information between a client and a server as a JSON object.

You can find the entire code here: https://github.com/harsha-sam/jwt-auth-tutorial

How JWT works

Before JWT:

With JWT:

JWT token looks like this:
Reference: https://jwt.io/

JWT has three parts separated by dots (.) . JWT will be created with a secret.
1. Header: First part denotes the hash of header (header generally consists of algorithm used for hashing and type)
2. Payload: Second part will have hash of the payload (payload will contain user id and info, this will be decoded when we verify the JWT.
3. Signature: Third part will contain an hash of (header + '.' + payLoad + secret). This part plays a crucial role in finding whether the user or anyone didn't tamper with the token before sending the request.
So, what verifying JWT will do is, it generates the third part of the hash again from the first and second parts of the JWT token sent with the request. If it matches, then we can get the payload.
Even if any payload or data is modified in frontend and sent to backend. JWT verify will fail because third hash going to be different if data is tampered.
The advantage of the JWT is we are storing the user info in token itself. So, it will work across all servers.

Let's dive into the implementation:

Initial setup and Installing libraries

Create a new directory and move in to the directory
Now, run:
npm init - y

The above command will initialise the package.json file

Let's install all required dependencies:

Run:
npm i express jsonwebtoken dotenv bcrypt cors express

To install nodemon as a dev-dependency
npm i —save-dev nodemon
Now, package.json will look something like this:

{
  "name": "jwt-auth-tutorial",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
        // added devStart command
    "devStart": "nodemon server.js",
    "start": "node server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
    "dependencies": {
        "bcrypt": "^5.0.1",
        "cors": "^2.8.5",
        "dotenv": "^10.0.0",
        "express": "^4.17.1",
        "jsonwebtoken": "^8.5.1"
      },
      "devDependencies": {
        "nodemon": "^2.0.12"
      }
}

Add start and devStart commands in your package.json file, if they don't exist.

Creating env file

Create a file with name .env in your project folder where we are going to store all our app secrets 🔒
Let's add our first secret APP_PORT which basically stores the port number on which our server is going to run.
Now, your .env file should look something like this

APP_PORT=3000

Setting up an endpoint with express

Let's create our first endpoint with express in our index.js file. ( Create the file, if it doesn't exist)

// index.js
var express = require('express');
require('dotenv').config() // will config the .env file present in the directory

const PORT = process.env.APP_PORT || "8081";
const app = express();

app.get('/', (req, res) => {
  res.send("Hello !")
})

app.listen(PORT, () => {
  console.log("Listening on port", PORT);
})

Let's test this endpoint with Postman

Great, seems like our endpoint is working

Setting up login route

Before creating a login route, let's first create a fake db that stores credentials

// index.js
var express = require('express');
require('dotenv').config() // will config the .env file present in the directory

const db = [
  {
    username: "Harsha",
    password: "hello123"
  },
  {
    username: "Sam",
    password: "hello12345"
  },
]
const POSTS = [
  {
    name: "Harsha",
    title: "Post 1",
    body: "1234"
  },
  {
    name: "Sam",
    title: "Post 2",
    body: "1234"
  },
]

const PORT = process.env.APP_PORT || "8081";
const app = express();

app.get('/', (req, res) => {
  res.send("Hello !")
})
app.get("/posts", (req, res) => {
  res.status(200).json(POSTS);
})

app.listen(PORT, () => {
  console.log("Listening on port", PORT);
})

JWT with access token and refresh token

Let's create a login endpoint now, which will authenticate the user first and then generates a JWT token.
To generate a JWT token, we use jwt.signin(user_info, secret, {expiresIn}) method, we'll pass in user info object and a secret and expires in time, if you want to expire the token.
Secret token can be anything but for best practice let us generate this secret token using crypto node library as shown below

Add these secrets generated in .env file as ACCESS_TOKEN_SECRET and REFRESH_TOKEN_SECRET

Complete Implementation:

var express = require('express');
var bcrypt = require('bcrypt');
var jwt = require('jsonwebtoken');
require('dotenv').config()// will config the .env file present in the directory

let POSTS = [
  {
    username: "Harsha",
    title: "Post 1",
    body: "1234"
  },
  {
    username: "Harsha",
    title: "Post 2",
    body: "1234"
  },
  {
    username: "Harsha",
    title: "Post 2",
    body: "1234"
  },
  {
    username: "Sm",
    title: "Post 2",
    body: "1234"
  },
  {
    username: "no",
    title: "Post 2",
    body: "1234"
  },
]

let DB = []

// used to store refresh tokens, as we will manually expire them
let SESSIONS = []

const generateAccessToken = (user) => {
  // jwt will make sure to expire this token in 1 hour
  return jwt.sign(user, process.env.ACCESS_TOKEN_SECRET, {
    'expiresIn': '1h'
  })
}

const PORT = process.env.APP_PORT || "8081";
const app = express();
app.use(express.json())

// middlewares
const validateToken = async (token, tokenSecret) => {
  // returns user info, if the jwt token is valid
  return await jwt.verify(token, tokenSecret,
    (error, payload) => {
      if (error) {
      throw (error)
      }
      return payload
  })
}
const validateAccessToken = async (req, res, next) => {
  // returns user info, if the jwt token is valid
  try {
    req.user = await validateToken(req.body['accessToken'], process.env.ACCESS_TOKEN_SECRET)
    next();
  }
  catch (error) {
    res.status(401).
      json({ error: error.message || 'Invalid access token' })
  }
}

const validateRefreshToken = async (req, res, next) => {
  try {
    req.user = await validateToken(req.body['refreshToken'], process.env.REFRESH_TOKEN_SECRET)
    next();
  }
  catch (error) {
    res.status(401).
      json({ error: error.message || 'Invalid refresh token' })
  }
}

app.get("/posts", validateAccessToken, (req, res) => {
  const { username } = req.user;
  const userPosts = POSTS.filter((post) => post.username === username)
  res.json(userPosts)
})

app.post("/register", async (req, res) => {
  const { username, password } = req.body;
  let hash = "";
  const salt = await bcrypt.genSalt(12);
  hash = await bcrypt.hash(password, salt);
  DB.push({ username, passwordHash: hash })
  console.log(DB);
  res.json("Successfully registered")
})

app.post("/login", async (req, res) => {
  const { username, password } = req.body;
  for (let user of DB) {
    // authentication - checking if password is correct
    if (user.username === username && await bcrypt.compare(password, user.passwordHash)) {
      const accessToken = jwt.sign({ username: user.username }, process.env.ACCESS_TOKEN_SECRET, {
        'expiresIn': '1h'
      })
// In this implementation, refresh token doesn't have any expiration date and it will be used to generate new access token
      const refreshToken = jwt.sign({ username: user.username }, process.env.REFRESH_TOKEN_SECRET)
// We will store refresh token in db and it'll expire when the user logs out
      SESSIONS.push(refreshToken);
// sending accesstoken and refresh token in response
      res.json({ accessToken, refreshToken });
    }
  }
})

app.post('/token', validateRefreshToken, (req, res) => {
  // generating new access token, once the refresh token is valid and exists in db
  const { username } = req.user;
  if (SESSIONS.includes(req.body['refreshToken'])) {
    res.json({ accessToken: generateAccessToken({ username })})
  }
  else {
    res.status(403).json('Forbidden: refresh token is expired')
  }
})

app.delete("/logout", async (req, res) => {
  // deleting refresh token from db 
  SESSIONS = SESSIONS.filter((session) => session != req.body['refreshToken']);
  res.sendStatus(204);
})

app.get('/', (req, res) => {
  res.send("Hello !")
})
app.listen(PORT, () => {
  console.log("Listening on port", PORT);
})

Installing Node.JS in Mac

Harshavardhan — Sun, 16 May 2021 16:53:16 +0000

According to nodejs.org,

Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine. 🤯

Let me simplify this definition for you.

So, What is a runtime?

You can think of the runtime as an environment that can run javascript code and also does have some extra functionality.

And, what's a JavaScript Engine? 🤔

According to Wikipedia, a JavaScript engine is a computer program that executes JavaScript Code.

V8 from Google is the most used JavaScript engine.
SpiderMonkey was developed by Mozilla.
Chakra is the engine of the Internet Explorer browser

Installing Node.JS

Navigate to nodejs.org

The node team always gives us two main versions of node runtime :

LTS ( Long Term Support ): Stability and Code won't break ( No bugs )

💡 Use LTS if you're working on some app and want to deploy it within a few weeks.

Current ( Latest Features ): No stability

💡 Use the Current version if you're working on an app that will take at least a year to complete and push to production.

You can find the scheduled releases here for node : https://nodejs.org/en/about/releases/

The simplest way to install Node.JS is to download the LTS or Current Version installer for your operating system.

Download the installer from https://nodejs.org/en/download/ and then open it.

You'll get something like this :

Click on continue
Agree to the license and follow the steps.

To check whether node.js is installed :
After the installation is completed, Open Terminal App in your Mac and type :

node --version or node -v.

These commands will return the version of node.js installed in your mac.

You can also install node.js via package managers like nvm.

nvm stands for node version manager and is used to have multiple versions of node installed at the same time and it allows us to install, uninstall, switch version, etc.

To install node.js via nvm, we should first install nvm in our mac.

Installing nvm(node version manager):

Copy the install script from https://github.com/nvm-sh/nvm#installation-and-update and paste it in the terminal.

Close and reopen the terminal after nvm is successfully installed.

Enter command -v nvm in terminal. If you see nothing listed, then this means nvm is not loaded into the shell. To fix this:

Check if we have a ~/.bash_profile file.
If we have the file then open it in the nano text editor with the command nano ~/.bash_profile.
Otherwise, create the file with the command touch ~/.bash_profile and open it.
Add source ~/.bashrc at the bottom of the ~/.bash_profile file. Save and close the editor.
Type source ~/.bash_profile in the terminal. This will re-run the bash profile

Now after nvm is successfully installed and loaded. We can install the node now.
Open https://nodejs.org/en/ and figure out the node version you want to install.
Now, type nvm install <version> to install the node version.

For example, if you want to install, node version 14.15.1. Run nvm install 14.15.1 in the terminal.

nvm install node will install the latest node version.
nvm use <version> - to use a specific node version.

How to deploy a website with Azure Static Web Apps Service

Harshavardhan — Sun, 25 Apr 2021 10:05:54 +0000

Confused about how to deploy your web application? 🤔

If yes, then this article is for you. I'll try my best to make it simpler for you 😅

Introduction

There are many static site hosting services available to host your projects like GitHub Pages,
Netlify, Digital Ocean, and Microsoft Azure recently released Azure Static Web Apps and it’s in the preview mode.

And we'll be looking at the Azure Static Web Apps in this post.

Prerequisites

Firstly, a GitHub account and an Azure account.
If you don't have an existing repository with the source code of your web app, then create a new repository in your GitHub profile and push the source code.

Creating a static web app in Azure

1) Open Azure Portal and sign in with your account.

Your Dashboard will look something like this:

2) Select Create a resource

3) Search for Static Web Apps and select Static Web Apps (Review) from search results.

4) Now, you'll be on a page like this:

5) Select Create

Now, config your app by entering all the details in the Basics Section.

1) Choose your Azure Subscription.
2) Select an existing resource group or create a new resource group.

If you're wondering about what a resource group is, they are just like folders to organize and manage all your resources.

3) Name your app and select a Region closest to you.
4) Authenticate with GitHub.
5) After successfully signing in, fill out repository details.

Select your preferred Organization

Select the Repository which has the source code of your app and select main from the Branch drop-down.

Enter the build details depending on your frontend framework.

6) Select Review + Create.

7) Select Create.

8) After the deployment build finishes running. Select Go to the resource.

9) Now click on the banner that says, Click here to check the status of your GitHub Actions runs takes you to the GitHub Actions running against your repository.

10) Once you verify the deployment job is complete, then you can navigate to your website via the generated URL.

If you want to update your app, push the changes to the repository, and GitHub actions will automate the deployment with new changes.

That's it for this article, I hope you found it useful ❤️

Object Literals

Harshavardhan — Tue, 16 Feb 2021 05:57:32 +0000

An object is a collection of key-value pairs.
Here's a snippet of an object with one property and one function.

const person = {
    name: "Harsha",
    greet: (msg, name) => {
        console.log(message + "" + name + "!");
    }
}

With ES6, we got some enhancements to object literals.

Key Shorthand and Function Shorthand

const name = 'Harsha'
const age = 19

const person = {
    name: name,
    age: age
    greet: function () => {
      console.log("Hi")
    }
}

In the above code, we are creating an object person with name and age property and we assigned them the values of our constant variables name and age. And we also have a greet property that has a function assigned to it.

Javascript introduced a shorthand notation to set object keys that have the same name as the variable you are assigning the value with. And also we can omit the function keyword in the object and define functions in a similar way as we do in class.

With the key shorthand notation and function shorthand notation, the above code can be written as:

const name = 'Harsha'
const age = 19

const person = {
    name,
    age,
    greet() => {
      console.log("Hi")
    }
}

As you can see the above code looks way better, cleaner, and easier in terms of writing.

Dynamic Properties

With ES6 we can directly use our variable as a property in the object literal.

const dynamicKey="name"
const object = {
  [dynamicKey]: "Harsha"
}

As you can see in the above example, we need to wrap our computed property names in the square brackets. The above object is the same as

const object = {
   "name": "Harsha"
}

Check if two trees are the same

Harshavardhan — Mon, 18 Jan 2021 16:35:01 +0000

Two binary trees are considered the same if they are structurally identical, and the nodes have the same value.

     1               |             1
   /   \             |           /   \
  2     3            |          2     3

The above trees are the same as the structure is identical and nodes have the same value.

     1               |             1
   /   \             |           /   \
  2     1            |          1     2

The above trees are not the same because nodes don't have the same value.

If you're curious to solve this problem before checking out the solution. Try it out in Leetcode 😉 .

You can find my solutions to other leetcode problems at https://github.com/harsha-sam/Leetcode-Solutions.

Solution

I'll be using the boilerplate code from leetcode. You can directly submit the solution and verify, once you understand how the algorithm works.

Depth-first search both trees at the same time and return false if the structure is not identical or if the node values don't match.

# Definition for a binary tree node.
# class TreeNode:
#     def __init__(self, val=0, left=None, right=None):
#         self.val = val
#         self.left = left
#         self.right = right
class Solution:
    def isSameTree(self, p: TreeNode, q: TreeNode) -> bool:
        return self.helper(p, q)

    def helper(self, node1, node2):
        # returns false if structure is not identical
        if node1 and not node2 or node2 and not node1:
            return False
        elif node1 and node2:
            if not self.helper(node1.left, node2.left):
                return False
            if node1.val != node2.val:
                return False
            if not self.helper(node1.right, node2.right):
                return False
        return True

Time Complexity: O(N)
Space Complexity: O(tree height)

useState Hook

Harshavardhan — Sat, 09 Jan 2021 04:53:31 +0000

What are React Hooks?

React Hooks are built-in functions that allow us to use state and lifecycle methods in functional components.

Rules of Hooks

Starts with use
Always should be invoked inside a function/component body or in another hook
The component in which it's being used should be uppercase (custom component)
Don’t call Hooks inside loops, conditions, or nested functions

useState Basics

useState enables us to add state to functional components.
It takes in a value (initial state) that can be anything (array, object, string, boolean, etc) and returns an array consisting of the current state and a function that updates the state.

One important thing to remember is the update function doesn't update the state right away.

import React, { useState } from "react";

const App = () => {
  const [value, setValue] = useState(0);
  return (
    <div className="App">
      <h1>Counter: {value}</h1>
      <button>Increment</button>
    </div>
  );
};
export default App;

Updating the state

Let's update the counter whenever we click on a button

import React, { useState } from "react";

const App = () => {
  const [value, setValue] = useState(0)
  return (
    <div className="App">
      <h1>Counter: {value}</h1>
      <button onClick={(() => setValue(value + 1))}>
        Increment
      </button>
    </div>
  );
}
export default App;

Delaying the increment for a while after click

import React, { useState } from "react";

const App = () => {
  const [value, setValue] = useState(0)

  const complexIncrease = () => {
    setTimeout(() => {
      setValue(value + 1)
    }, 2000)
  }
  return (
    <div className="App">
      <h1>Counter: {value}</h1>
      <button onClick={(() => setValue(value + 1))}>
        Increment
      </button>
      <button onClick={complexIncrease}>
        Complex Increase
      </button>
    </div>
  );
}
export default App;

There's a gotcha above. If you continuously click on complex increment, you may notice that the value changes only once, no matter how many times you clicked.
To fix this, use Functional update of useState:

Functional Update (useState)

useState((previousstate) ⇒ {

// Always return something
// change previous state

return new state

})

If the new state is computed using the previous state, we can pass a function to useState. The function will receive the previous value, and return an updated value

import React, { useState } from "react";

const App = () => {
  const [value, setValue] = useState(0)

  const complexIncrease = () => {
    setTimeout(() => {
      setValue((prev) => prev + 1)
    }, 2000)
  }
  return (
    <div className="App">
      <h1>Counter: {value}</h1>
      <button onClick={(() => setValue(value + 1))}>
        Increment
      </button>
      <button onClick={complexIncrease}>
        Complex Increase
      </button>
    </div>
  );
}
export default App;

Now the counter works perfectly. 🤟🏻

Here's the sandbox link for above code.

Check if a binary tree is a subtree of another binary tree

Harshavardhan — Wed, 06 Jan 2021 10:38:28 +0000

Everything which is a descendant of a tree is known as a subtree.
A binary tree(s) is said to be a subtree of another binary tree(t) if s is a descendant of t and follows exact order same as in s. The tree t could also be considered as a subtree of itself.

For the above tree

   4                   |           4                                
  / \                  |          / 
 3   6                 |         3
                       |
This is a subtree      |       This is not a subtree
                       |

If you're curious to solve this problem before checking out the solution. Try it out in Leetcode 😉 .

You can find my solutions to other leetcode problems at https://github.com/harsha-sam/Leetcode-Solutions.

Solution

I'll be using the boilerplate code from leetcode. You can directly submit the solution and verify, once you understand how the algorithm works.

Comparing Nodes Approach:

Depth-First Search the tree T and whenever you find a node that has the same value as the root node of the tree S, Compare both tree T and S from this corresponding node of T and check for equality by comparing all nodes of both trees.


# Definition for a binary tree node.
# class TreeNode:
#     def __init__(self, val=0, left=None, right=None):
#         self.val = val
#         self.left = left
#         self.right = right

class Solution:
    def isSubtree(self, s: TreeNode, t: TreeNode) -> bool:
        '''
        Depth first searches both trees and compares 
        all nodes. 
        Returns False whenever two different nodes 
        encountered
        Returns True when both trees are completely 
        explored and equal.
        '''
        def check_equal(tree1, tree2):
            if tree1 and not tree2 or tree2 and not tree1:
                return False
            elif tree1 and tree2:
                if tree1.val != tree2.val:
                    return False
                if not check_equal(tree1.left, tree2.left):
                    return False
                if not check_equal(tree1.right, tree2.right):
                    return False
            return True

        def explore(curr, t):
            if curr:
                # if a node which has same value as root s is encountered, we check for quality
                if curr.val == t.val and check_equal(curr, t):
                    return True
                if explore(curr.left, t):
                    return True
                if explore(curr.right, t):
                    return True

        return explore(s, t)

Time Complexity: O(N * M) - Where M = number of nodes in subtree t and N = number of nodes in tree s
Space Complexity: O(N) - Depth in recursion can go upto n nodes. n refers to number of nodes in s.

Invert a Binary Tree

Harshavardhan — Mon, 04 Jan 2021 16:29:08 +0000

Consider a Binary Tree (T). The inversion of T is also a Binary tree (M) with left and right children of T swapped.

If you're curious to solve this problem before checking out the solution. Try it out in Leetcode 😉 .

You can find my solutions to other leetcode problems at https://github.com/Rage-ops/Leetcode-Solutions.

Solution

We can solve this problem both iteratively and recursively.
I'll be using the boilerplate code from leetcode to show both approaches. You can directly submit the solution and verify, once you understand how the algorithm works.

Recursive Approach

Let's just create an invert function that will take our original binary tree and return the inverted binary tree.

And the functionality of the invert function should be:

Swap left and right child nodes of the current node.
Call invert for the left child.
Call invert for the right child.

This sounds so easy right ?. Yes, it is 😄. We can literally solve this problem recursively with these three lines of code.

# Definition for a binary tree node.
# class TreeNode:
#     def __init__(self, val=0, left=None, right=None):
#         self.val = val
#         self.left = left
#         self.right = right
class Solution:
    def invertTree(self, root: TreeNode) -> TreeNode:
        self.helper(root)
        return root

    # recursive     
    def helper(self, node):
        if node:
            node.left, node.right = node.right, node.left
            self.helper(node.left)
            self.helper(node.right)

Iterative Approach

Use BFS to explore the tree and swap left and right child for every node.

# Definition for a binary tree node.
# class TreeNode:
#     def __init__(self, val=0, left=None, right=None):
#         self.val = val
#         self.left = left
#         self.right = right
from queue import Queue
class Solution:
    def invertTree(self, root: TreeNode) -> TreeNode:
        return self.iterative_invert(root)

    def iterative_invert(self, root):
        if root:
            q = Queue()
            q.put(root)
            while q.qsize() > 0:
                node = q.get()
                node.left, node.right = node.right, node.left
                if node.left:
                    q.put(node.left)
                if node.right:
                    q.put(node.right)
        return root

Time Complexity: O(N) as we are visiting each node at once.

Space Complexity: O(N) since in the worst case, the queue will contain all nodes of the binary tree.

The time and space complexities are the same for both the recursive and iterative approaches. In the case of recursion, we can have n function calls placed in the stack at the same time in the worst-case scenario.

Advent of Code 2020 (Day - 7 Handy Haversacks)

Harshavardhan — Fri, 11 Dec 2020 07:41:41 +0000

To solve this challenge visit https://adventofcode.com/2020/day/7

You can find my solutions for other problems at :
https://github.com/Rage-ops/Advent-of-code-2020

Puzzle Part - 1

You land at the regional airport in time for your next flight. In fact, it looks like you'll even have time to grab some food: all flights are currently delayed due to issues in luggage processing.

Due to recent aviation regulations, many rules (your puzzle input) are being enforced about bags and their contents; bags must be color-coded and must contain specific quantities of other color-coded bags. Apparently, nobody responsible for these regulations considered how long they would take to enforce!

For example, consider the following rules:

light red bags contain 1 bright white bag, 2 muted yellow bags.
dark orange bags contain 3 bright white bags, 4 muted yellow bags.
bright white bags contain 1 shiny gold bag.
muted yellow bags contain 2 shiny gold bags, 9 faded blue bags.
shiny gold bags contain 1 dark olive bag, 2 vibrant plum bags.
dark olive bags contain 3 faded blue bags, 4 dotted black bags.
vibrant plum bags contain 5 faded blue bags, 6 dotted black bags.
faded blue bags contain no other bags.
dotted black bags contain no other bags.

These rules specify the required contents for 9 bag types. In this example, every faded blue bag is empty, every vibrant plum bag contains 11 bags (5 faded blue and 6 dotted black), and so on.

You have a shiny gold bag. If you wanted to carry it in at least one other bag, how many different bag colors would be valid for the outermost bag? (In other words: how many colors can, eventually, contain at least one shiny gold bag?)

In the above rules, the following options would be available to you:

A bright white bag, which can hold your shiny gold bag directly.
A muted yellow bag, which can hold your shiny gold bag directly, plus some other bags.
A dark orange bag, which can hold bright white and muted yellow bags, either of which could then hold your shiny gold bag.
A light red bag, which can hold bright white and muted yellow bags, either of which could then hold your shiny gold bag.

So, in this example, the number of bag colors that can eventually contain at least one shiny gold bag is 4.

How many bag colors can eventually contain at least one shiny gold bag? (The list of rules is quite long; make sure you get all of it.)

Parsing Input File

My intuition was to first construct a directed graph satisfying all dependencies of the bags (i.e., outer bag have an edge going towards all the inner bags).

import re


adj = {}
visited = {}
with open("Problem-7/Day 7: Handy Haversacks.txt") as file:
    for line in file:
        # Every line in the input was in the format outerbags contain x innerbags, y innerbags, so on..
        # So we can split every line into two parts using the word "contain " as separator. 
        # As split funtion returns a list, we now have outerbag name as first element and it's dependencies as second element. Unpacked them into two variables as shown below.
        outer_bag, innerbags = line.split("contain ")
        # Now the outer_bag variable has outerbagname with suffix bags in it. We can just slice the string to remove the suffix
        # Similarly, innerbags will now has a string in the format x innerbags, y innerbags, so on..
        # We can extract the count and the innerbag name using regex and grouping as shown below
        innerbags = re.findall(r"(\d{1,}) ([a-z ]+) bag|bags", innerbags)
        # visited list is useful when we are exploring the graph to avoid cycles. Initially we should mark every bag as not visited
        visited[outer_bag[:-6]] = False
        if outer_bag[:-6] not in adj:
            adj[outer_bag[:-6]] = {}
        # Adding edges from outer bag to each inner bag
        for count, bag in innerbags:
            if count and bag:
                if bag not in adj:
                    adj[bag] = {}
                adj[outer_bag[:-6]][bag] = int(count)
# Now we have our adjacency list ready for our directed graph

Solution for Part 1

The question was to find how many different bag colors would be valid for the outermost bag if we wanted to carry a shiny gold bag?.

We can now find the solution by counting number of vertices(bags) from which we can reach shiny gold bag vertex. - We can solve it by exploring the graph completely or just by exploring only vertices that has an edge going towards the shiny gold bag vertex. (i.e., Simply find the strongly connected components which has shiny gold bag vertex in it)

def part_one(adj, visited, bag_name):
# dfs of a graph
    def dfs(adj, visited, start, count):
        for edge in adj[start].keys():
            if not visited[edge]:
                visited[edge] = True
                count = dfs(adj, visited, edge, count + 1)
        return count


    # reverse the graph 
    adj_reverse = {}
    for outer, inner in adj.items():
        if outer not in adj_reverse:
            adj_reverse[outer] = {}
        for key, count in inner.items():
            if key in adj_reverse:
                adj_reverse[key][outer] = count
            else:
                adj_reverse[key] = {outer: count}
    # Now as the graph is reversed, we can find the vertices that previously had a directed edge towards the shiny gold bag now in new adjacency list at shiny gold vertex.
    # Simply exploring and counting the number of vertices explored from shiny gold bag vertex will be the result
    return dfs(adj_reverse, visited, bag_name, 0)

Puzzle Part - 2

It's getting pretty expensive to fly these days - not because of ticket prices, but because of the ridiculous number of bags you need to buy!

Consider again your shiny gold bag and the rules from the above example:

faded blue bags contain 0 other bags.
dotted black bags contain 0 other bags.
vibrant plum bags contain 11 other bags: 5 faded blue bags and 6 dotted black bags.
dark olive bags contain 7 other bags: 3 faded blue bags and 4 dotted black bags.

So, a single shiny gold bag must contain 1 dark olive bag (and the 7 bags within it) plus 2 vibrant plum bags (and the 11 bags within each of those): 1 + 1*7 + 2 + 2*11 = 32 bags!

Of course, the actual rules have a small chance of going several levels deeper than this example; be sure to count all of the bags, even if the nesting becomes topologically impractical!

Here's another example:

shiny gold bags contain 2 dark red bags.
dark red bags contain 2 dark orange bags.
dark orange bags contain 2 dark yellow bags.
dark yellow bags contain 2 dark green bags.
dark green bags contain 2 dark blue bags.
dark blue bags contain 2 dark violet bags.
dark violet bags contain no other bags.

In this example, a single shiny gold bag must contain 126 other bags.

How many individual bags are required inside your single `shiny gold` bag?

Solution for Part 2

Searching the graph using dfs and keeping the count of bags at each level recursively will give the result.

def part_two(adj, start, count):
    if not adj[start]:
        return 0
    temp = 0
    for edge, c in adj[start].items():
        temp += c + c * part_two(adj, edge, count)
    count += temp
    return count

Complete Solution with Part 1 and Part 2 in Python

# Advent of Code 2020 Day 7
import re


adj = {}
visited = {}
with open("Problem-7/Day 7: Handy Haversacks.txt") as file:
    for line in file:
        # Every line in the input was in the format outerbags contain x innerbags, y innerbags, so on..
        # So we can split every line into two parts using the word "contain " as separator.
        # As split funtion returns a list, we now have outerbag name as first element and it's dependencies as second element. Unpacked them into two variables as shown below.
        outer_bag, innerbags = line.split("contain ")
        # Now the outer_bag variable has outerbagname with suffix bags in it. We can just slice the string to remove the suffix
        # Similarly, innerbags will now has a string in the format x innerbags, y innerbags, so on..
        # We can extract the count and the innerbag name using regex and grouping as shown below
        innerbags = re.findall(r"(\d{1,}) ([a-z ]+) bag|bags", innerbags)
        # visited list is useful when we are exploring the graph to avoid cycles. Initially we should mark every bag as not visited
        visited[outer_bag[:-6]] = False
        if outer_bag[:-6] not in adj:
            adj[outer_bag[:-6]] = {}
        # Adding edges from outer bag to each inner bag
        for count, bag in innerbags:
            if count and bag:
                if bag not in adj:
                    adj[bag] = {}
                adj[outer_bag[:-6]][bag] = int(count)
# Now we have our adjacency list ready for our directed graph


def part_one(adj, visited, bag_name):
    # dfs of a graph
    def dfs(adj, visited, start, count):
        for edge in adj[start].keys():
            if not visited[edge]:
                visited[edge] = True
                count = dfs(adj, visited, edge, count + 1)
        return count

    # reverse the graph
    adj_reverse = {}
    for outer, inner in adj.items():
        if outer not in adj_reverse:
            adj_reverse[outer] = {}
        for key, count in inner.items():
            if key in adj_reverse:
                adj_reverse[key][outer] = count
            else:
                adj_reverse[key] = {outer: count}
    # Now as the graph is reversed, we can find the vertices that previously had a directed edge towards the shiny gold bag now in new adjacency list at shiny gold vertex.
    # Simply exploring and counting the number of vertices explored from shiny gold bag vertex will be the result
    return dfs(adj_reverse, visited, bag_name, 0)


def part_two(adj, start, count):
    if not adj[start]:
        return 0
    temp = 0
    for edge, c in adj[start].items():
        temp += c + c * part_two(adj, edge, count)
    count += temp
    return count


print("Part 1: Total number of bag colors that contain at least one shiny gold bag :",
      part_one(adj, visited, "shiny gold"))
print("Part 2: Shiny gold bag contains total {} number of bags".format(
    part_two(adj, "shiny gold", 0)))

Advent of Code (Day - 4 Passport Processing)

Harshavardhan — Wed, 09 Dec 2020 06:46:47 +0000

To solve this challenge visit https://adventofcode.com/2020/day/4

You can find my solutions for other problems at :
https://github.com/Rage-ops/Advent-of-code-2020

The challenge is to validate passports

Part 1

Detecting which passports have all required fields. The expected fields are as follows:

byr (Birth Year)
iyr (Issue Year)
eyr (Expiration Year)
hgt (Height)
hcl (Hair Color)
ecl (Eye Color)
pid (Passport ID)
cid (Country ID)

Passport data is validated in batch files (your puzzle input). Each passport is represented as a sequence of key:value pairs separated by spaces or newlines. Passports are separated by blank lines.

Here is an example batch file containing four passports:

ecl:gry pid:860033327 eyr:2020 hcl:#fffffd
byr:1937 iyr:2017 cid:147 hgt:183cm

iyr:2013 ecl:amb cid:350 eyr:2023 pid:028048884
hcl:#cfa07d byr:1929

hcl:#ae17e1 iyr:2013
eyr:2024
ecl:brn pid:760753108 byr:1931
hgt:179cm

hcl:#cfa07d eyr:2025 pid:166559648
iyr:2011 ecl:brn hgt:59in

The first passport is valid - all eight fields are present. The second passport is invalid - it is missing hgt (the Height field).

The third passport is interesting; the only missing field is cid, so it looks like data from North Pole Credentials, not a passport at all! Surely, nobody would mind if you made the system temporarily ignore missing cid fields. Treat this "passport" as valid.

The fourth passport is missing two fields, cid and byr. Missing cid is fine, but missing any other field is not, so this passport is invalid.

According to the above rules, your improved system would report 2 valid passports.

Count the number of valid passports - those that have all required fields. Treat cid as optional. In your batch file, how many passports are valid?

Solution in Python

Parsing Input File

import re

with open("Problem-4/Day 4: Passport Processing.txt") as file:
    # As passports are separated by blank line
    data = file.read().split("\n\n")
    # Now data will have a list of all passports

Solution Part 1

import re

with open("Problem-4/Day 4: Passport Processing.txt") as file:
    # As passports are separated by blank line
    data = file.read().split("\n\n")
    # Now data will have a list of all passports

required_keys =  ['byr', 'iyr', 'eyr', 'hgt', 'hcl', 'ecl', 'pid']
out = 0

for passport in data:
        # key:value pairs are separated by spaces and newlines
        # Replacing those spaces and newlines which separate key:value pairs by ", "
        row = re.sub(r'[\n ]{1,}', ", ", passport) + ","
        #  Extracting key: value pairs from the passport
        #  re.findall will return a list of tuples where each tuple has two elements key and value respectively
        # dict function will generate a dictonary from those list of tuples
        d = dict(re.findall(r'([a-z]+):(.*?),', row))
        # If all required keys are present in the passport
        if all([key in d.keys() for key in required_keys]):
            out += 1
print('There are %d valid passports according to part 1.' % out)

Part 2

Checking data validation for required fields.
You can continue to ignore the cid field, but each other field has strict rules about what values are valid for automatic validation:

byr (Birth Year) - four digits; at least 1920 and at most 2002.
iyr (Issue Year) - four digits; at least 2010 and at most 2020.
eyr (Expiration Year) - four digits; at least 2020 and at most 2030.
hgt (Height) - a number followed by either cm or in:
If cm, the number must be at least 150 and at most 193.
If in, the number must be at least 59 and at most 76.
hcl (Hair Color) - a # followed by exactly six characters 0-9 or a-f.
ecl (Eye Color) - exactly one of: amb blu brn gry grn hzl oth.
pid (Passport ID) - a nine-digit number, including leading zeroes.
cid (Country ID) - ignored, missing or not.

Your job is to count the passports where all required fields are both present and valid according to the above rules. Here are some example values:

byr valid:   2002
byr invalid: 2003

hgt valid:   60in
hgt valid:   190cm
hgt invalid: 190in
hgt invalid: 190

hcl valid:   #123abc
hcl invalid: #123abz
hcl invalid: 123abc

ecl valid:   brn
ecl invalid: wat

pid valid:   000000001
pid invalid: 0123456789

Here are some invalid passports:

eyr:1972 cid:100
hcl:#18171d ecl:amb hgt:170 pid:186cm iyr:2018 byr:1926

iyr:2019
hcl:#602927 eyr:1967 hgt:170cm
ecl:grn pid:012533040 byr:1946

hcl:dab227 iyr:2012
ecl:brn hgt:182cm pid:021572410 eyr:2020 byr:1992 cid:277

hgt:59cm ecl:zzz
eyr:2038 hcl:74454a iyr:2023
pid:3556412378 byr:2007

Here are some valid passports:

pid:087499704 hgt:74in ecl:grn iyr:2012 eyr:2030 byr:1980
hcl:#623a2f

eyr:2029 ecl:blu cid:129 byr:1989
iyr:2014 pid:896056539 hcl:#a97842 hgt:165cm

hcl:#888785
hgt:164cm byr:2001 iyr:2015 cid:88
pid:545766238 ecl:hzl
eyr:2022

iyr:2010 hgt:158cm hcl:#b6652a ecl:blu byr:1944 eyr:2021 pid:093154719

Count the number of valid passports - those that have all required fields and valid values. Continue to treat cid as optional. In your batch file, how many passports are valid?

Solution with Part1 and Part 2

import re

with open("Problem-4/Day 4: Passport Processing.txt") as file:
    # As passports are separated by blank line
    data = file.read().split("\n\n")
    # Now data will have a list of all passports

required_keys =  ['byr', 'iyr', 'eyr', 'hgt', 'hcl', 'ecl', 'pid']
out, out2 = 0, 0

for passport in data:
        # key:value pairs are separated by spaces and newlines
        # Replacing those spaces and newlines which separate key:value pairs by ", "
        row = re.sub(r'[\n ]{1,}', ", ", passport) + ","
        #  Extracting key: value pairs from the passport
        #  re.findall will return a list of tuples where each tuple has two elements key and value respectively
        # dict function will generate a dictonary from those list of tuples
        d = dict(re.findall(r'([a-z]+):(.*?),', row))
        # If all required keys are present in the passport
        if all([key in d.keys() for key in required_keys]):
            out += 1
            # Checking Validation
            if (2002 >= int(d['byr']) >= 1920 and 2020 >= int(d['iyr']) >= 2010
                and 2030 >= int(d['eyr']) >= 2020 and d['ecl'] in ["amb", "blu", "brn", "gry", "grn", "hzl", "oth"]
                and re.search(r'^#[0-9a-f]{6}$', d['hcl']) and re.match('^\d{9}$', d['pid'])):

                height = d['hgt']
                if (height[-2:] == 'cm' and 150 <= int(height[:-2]) <= 193) or (height[-2:] == 'in' and 59 <= int(height[:-2]) <= 76):
                    out2 += 1
print('There are %d valid passports according to part 1.' % out)
print('There are %d valid passports according to part 2.' % out2)

Solution with Part 1 and Part 2 in Javascript

const fs = require('fs');
const data = fs.readFileSync("Problem-4/Day 4: Passport Processing.txt").toString().split('\n\n');
const required_keys =  ['byr', 'iyr', 'eyr', 'hgt', 'hcl', 'ecl', 'pid'];
let [out1, out2] = [0, 0];

data.forEach((PassportData) => {
    const row = PassportData.split(/[\n ]{1,}/g);
    const entries = row.reduce((accum, info) => {
        accum.push(info.split(":"));
        return accum;
    }, []);
    const d = Object.fromEntries(entries);
    const keys = Object.keys(d);
    let flag = true;
    required_keys.forEach((key) => {
        if (! keys.includes(key)) {
            flag = false;
            return
        }
    })
    if(flag){

        out1++;
        if (2002 >= Number(d['byr']) &&  Number(d['byr']) >= 1920
            && 2020 >= Number(d['iyr']) && Number(d['iyr']) >= 2010
            && 2030 >= Number(d['eyr']) && Number(d['eyr'])>= 2020 
            && ["amb", "blu", "brn", "gry", "grn", "hzl", "oth"].includes(d['ecl'])
            && d['hcl'].match(/^#[0-9a-f]{6}$/) 
            && d['pid'].match(/^\d{9}$/)
            ){
            const height = d['hgt'];
            if ((height.slice(-2) === 'cm' && 150 <= Number(height.slice(0,-2)) &&  Number(height.slice(0,-2)) <= 193)
            || (height.slice(-2) === 'in' && 59 <= Number(height.slice(0,-2)) && Number(height.slice(0,-2)) <= 76)){

                out2++;
            }
        }
    }    
})
console.log(`There are ${out1} valid passports according to part 1.`);
console.log(`There are ${out2} valid passports according to part 2.`);

Advent of Code (Day - 2 Password Philosophy)

Harshavardhan — Tue, 08 Dec 2020 18:44:59 +0000

If you want to solve this puzzle, visit https://adventofcode.com/2020/day/2

Puzzle

The challenge is to validate passwords

Part 1

For example, suppose you have the following list:

1-3 a: abcde
1-3 b: cdefg
2-9 c: ccccccccc

Each line gives the password policy and then the password. The password policy indicates the lowest and highest number of times a given letter must appear for the password to be valid. For example, 1-3 a means that the password must contain a at least 1 time and at most 3 times.

In the above example, 2 passwords are valid. The middle password, cdefg, is not; it contains no instances of b, but needs at least 1. The first and third passwords are valid: they contain one a or nine c, both within the limits of their respective policies.

How many passwords are valid according to their policies?

Solution in Python

Parsing Input File

with open("Problem-2/Day-2-Password-Philosophy.txt") as file:
    for line in file:
        freq, letter, password = line.split(" ")
        letter = letter[:len(letter) - 1]
        low, high = map(int, freq.split('-'))

Solution Part 1

def partOne(low, high, letter, password):
    count = 0
# Counting frequency of the letter
    for char in password:
        if char == letter:
            count += 1
# Password is vaild if the frequency count lies in the low-high range
    return high >= count >= low

out1 = 0
with open("Problem-2/Day-2-Password-Philosophy.txt") as file:
    for line in file:
        freq, letter, password = line.split(" ")
        letter = letter[:len(letter) - 1]
        low, high = map(int, freq.split('-'))
        if partOne(low, high, letter, password):
            out1 += 1
print(out1)

Part 2

Each policy actually describes two positions in the password, where 1 means the first character, 2 means the second character, and so on. (Be careful; no concept of "index zero"!) Exactly one of these positions must contain the given letter. Other occurrences of the letter are irrelevant for the purposes of policy enforcement.

Given the same example list from above:

1-3 a: abcde is valid: position 1 contains a and position 3 does not.
1-3 b: cdefg is invalid: neither position 1 nor position 3 contains b.
2-9 c: ccccccccc is invalid: both position 2 and position 9 contain c.

How many passwords are valid according to the new interpretation of the policies?

Solution Part 2

def partTwo(position1, position2, letter, password):
    return (password[position1] == letter) ^ (password[position2] == letter)

Complete solution with Part 1 and Part 2 in Python

def partOne(low, high, letter, password):
    count = 0
    for char in password:
        if char == letter:
            count += 1
    return high >= count >= low


def partTwo(position1, position2, letter, password):
    return (password[position1] == letter) ^ (password[position2] == letter)


out1 = 0
out2 = 0
with open("Problem-2/Day-2-Password-Philosophy.txt") as file:
    for line in file:
        freq, letter, password = line.split(" ")
        letter = letter[:len(letter) - 1]
        low, high = map(int, freq.split('-'))
        if partOne(low, high, letter, password):
            out1 += 1
        if partTwo(low - 1, high - 1, letter, password):
            out2 += 1

print(out1, out2)

Complete solution with Part 1 and Part 2 in JavaScript

const partOne = (low, high, letter, password) =>{
    let count = 0;
    for(char of password){
        if (char === letter){
            count += 1;
        }
    }
    return (count >= low && count <= high);
}

const partTwo = (low, high, letter, password) =>{
    return (password[low] === letter) ^ (password[high] === letter)
}

const fs = require('fs');
const data = fs.readFileSync('Problem-2/Day-2-Password-Philosophy.txt').toString().split("\n");
let out1 = 0, out2 = 0;
data.forEach((line)=>{
    let [freq, letter, password] = line.split(' ');
    let [low, high] = freq.split('-').map((val) => Number(val));
    letter = letter.slice(0, letter.length - 1);
    if (partOne(low, high, letter, password)){ out1++; }
    if (partTwo(low - 1, high - 1, letter, password)){ out2++; }    
})

console.log(out1, out2);

DEV Community: Harshavardhan

JWT Authentication Tutorial with Node JS

How JWT works

Initial setup and Installing libraries

Creating env file

Setting up an endpoint with express

Setting up login route

JWT with access token and refresh token

Installing Node.JS in Mac

So, What is a runtime?

And, what's a JavaScript Engine? 🤔

Installing Node.JS

Installing nvm(node version manager):

How to deploy a website with Azure Static Web Apps Service

Introduction

Prerequisites

Creating a static web app in Azure

Object Literals

Key Shorthand and Function Shorthand

Dynamic Properties

Check if two trees are the same

The above trees are not the same because nodes don't have the same value.

Solution

useState Hook

What are React Hooks?

Rules of Hooks

useState Basics

Updating the state

Delaying the increment for a while after click

Functional Update (useState)

Check if a binary tree is a subtree of another binary tree

Solution

Invert a Binary Tree

Solution

Recursive Approach

Iterative Approach

Advent of Code 2020 (Day - 7 Handy Haversacks)

Puzzle Part - 1

Parsing Input File

Solution for Part 1

Puzzle Part - 2

How many individual bags are required inside your single shiny gold bag?

Solution for Part 2

Complete Solution with Part 1 and Part 2 in Python

Advent of Code (Day - 4 Passport Processing)

Part 1

Solution in Python

Parsing Input File

Solution Part 1

Part 2

Solution with Part1 and Part 2

Solution with Part 1 and Part 2 in Javascript

Advent of Code (Day - 2 Password Philosophy)

Puzzle

Part 1

Solution in Python

Parsing Input File

Solution Part 1

Part 2

Solution Part 2

Complete solution with Part 1 and Part 2 in Python

Complete solution with Part 1 and Part 2 in JavaScript

How many individual bags are required inside your single `shiny gold` bag?