#nextJs #TypeScript useEffect is a hook that allows you to perform side effects in function components.

import React, { useState, useEffect } from 'react';

function MyComponent() {
  const [count, setCount] = useState(0);

  // This effect will run only when the count state changes
  useEffect(() => {
    document.title = `You clicked ${count} times`;
  }, [count]); // Only re-runs when count changes

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

export default MyComponent;

In the above example: • We have a component MyComponent with a state variable count and a button to increment it. • Inside the component, we use the useEffect hook to update the document title with the current count after each render. • We pass [count] as the second argument to useEffect, which means the effect will only run when the count state changes. This is because we want to update the document title only when the count changes, not on every render.

#nextJs #TypeScript Function Argument Deconstructing: Deconstructing function arguments can make your code cleaner and more readable.

// Before deconstruction 
const BlogPost = (props) => { 
  const { title, content, author } = props; 
  // Render blog post using props
  return (
      <div>
          <h1>{props.title}</h1>
          <p>{props.content}</p>
          <p>Written by: {props.author}</p>
      </div>
  );
}; 

// After deconstruction 
const BlogPost = ({ title, content, author }) => { 
  // Render blog post with title, content, and author 
  return (
      <div>
          <h1>{title}</h1>
          <p>{content}</p>
          <p>Written by: {author}</p>
      </div>
  );
};

CMD-SHIFT-L is a great productivity booster for VS Code. Lets you select all instances of the current selection and edit with multiple cursors. #VSCodetip #ProductivityHack

Terraform alias is a feature that allows you to manage resources across multiple regions more efficiently. It enables you to define different configurations for resources in various regions while using the same Terraform codebase. Here's a simple example to illustrate how to use Terraform alias for multiple regions:

provider "aws" {
  alias  = "us_east"
  region = "us-east-1"
}

provider "aws" {
  alias  = "us_west"
  region = "us-west-1"
}
resource "aws_instance" "example" {
  provider      = aws.us_east
  ami           = "ami-0c55b159cbfafe1f0"
  instance_type = "t2.micro"
}

resource "aws_instance" "example_west" {
  provider      = aws.us_west
  ami           = "ami-0c55b159cbfafe1f0"
  instance_type = "t2.micro"
} 

In this example, we define two different AWS providers with aliases us_east and us_west, representing the US East and US West regions, respectively. Then, we create instances using these providers, specifying the region-specific provider for each instance. This allows Terraform to manage resources in different regions using the same configuration file. #terraform #iac

#devops #kubernetes k9s is a powerful command-line interface (CLI) tool for Kubernetes management. It allows you to interact with Kubernetes clusters efficiently, offering features like resource viewing, log access, event monitoring, and pod command execution—all from your terminal. Install k9s using Homebrew with the command brew install k9s, and access its intuitive interface by running k9s

Spread operator in JavaScript is represented by three dots (...). 
It's a useful syntax for manipulating arrays and objects in various ways.

Following are some of the use cases:-

Spread in Arrays:-

1. Copying Arrays: It allows you to create a new array by copying another array.

const originalArray = [1, 2, 3];
const copyArray = [...originalArray];
console.log(copyArray); // [1, 2, 3]


2. Concatenating Arrays: You can merge arrays together.

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const mergedArray = [...array1, ...array2];
console.log(mergedArray); // [1, 2, 3, 4, 5, 6]

3. Adding Elements to Arrays: You can add new elements to an existing array.

const array1 = [1, 2, 3];
const newArray = [...array1, 4, 5, 6];
console.log(newArray); // [1, 2, 3, 4, 5, 6]



Spread in Objects:-

1. Copying Objects: It allows you to create a shallow copy of an object.

const originalObj = { name: 'John', age: 30 };
const copyObj = { ...originalObj };
console.log(copyObj); // { name: 'John', age: 30 }

2. Merging Objects: You can merge multiple objects into one.

const obj1 = { name: 'John' };
const obj2 = { age: 30 };
const mergedObj = { ...obj1, ...obj2 };
console.log(mergedObj); // { name: 'John', age: 30 }

3. Adding Properties to Objects: You can add new properties to an object.

const obj1 = { name: 'John' };
const newObj = { ...obj1, age: 30 };
console.log(newObj); // { name: 'John', age: 30 }



Function Arguments:

1. Spread can be used to pass an array as individual arguments to a function.

const numbers = [1, 2, 3];
const sum = (a, b, c) => a + b + c;
console.log(sum(...numbers)); // 6

#devops #kubernetes #helm To verify the Helm chart, you can use the following command: minikube service servicename This command opens a web browser and directs it to a service running in your Minikube Kubernetes cluster. It simplifies accessing and testing applications deployed locally on Minikube.

git switch -c branch_name used in Git to create and switch to a new branch in one step. #gitcommand

The helm search hub <keyword> command is used to search for charts available in the Helm Hub, which is a centralized repository of Helm charts , keyword can be prometheus, grafana, nginx, postgresql etc. helm search hub <keyword> --max-col-width=0 this command displays the results without column width limitations. #devops #helm #helmhub #kubernetes

Empty a file using the > symbol. Simply typing > filename truncates the file, removing all its previous content. #UnixCommand