Image for post
Image for post

When we start building a Python project that goes beyond simple scripts, we tend to start using third-party dependencies. When working on a larger project, we need to think about managing these dependencies in an efficient manner. And when installing dependencies, we always want to be inside virtual environments. It helps keep things nice and clean. It also helps avoid messing up our Python environment.

Why do we need Python Virtual Environments?

We can use Pip to install packages to our Python project. And it is common to have multiple packages installed in a single Python project. …


Image for post
Image for post

AWS CLI is a great tool for doing anything related to AWS. We can configure our access key for an account using an access key ID and a secret access key. But what if we want to use multiple accounts on the same computer? If we are working on multiple AWS projects, or have different IAM roles for different projects?

Before setting things up for multiple accounts, let us do so for a single account.

Creating an AWS Profile

For authenticating ourselves, we need to create an AWS profile that is used for all future sessions. The access keys are used to sign our…


Image for post
Image for post

EcmaScript 2015 introduced yet another feature that has not been used widely yet. A JavaScript proxy allows us to wrap an existing object with a layer. The layer can provide us with capabilities such as the interception of attributes and methods. And this can be done even if the properties do not exist!

What does that mean?

A JavaScript proxy gives us the ability to change the underlying behavior of objects and functions. They can be considered as middlewares for JavaScript objects. …


As developers, we always want to be more productive. And who does not like to write more code using a lesser number of keystrokes? Code snippets provide is with exactly that. Let us dive deeper into Visual Studio Code snippets in detail in this post.

Code snippets refer to common functions, or file structures or templates that are great for rote work and boilerplate stuff. It is not something new. Traditionally, we used to store them in a file, and manually copy-pasted them wherever they were needed.

Some of you might be shaking your heads about having a file to…


Learn how to deal with the “Can’t perform a React state update on an unmounted component” warning

Image for post
Image for post

Let us take a look at an implementation of getting data from an API request and see if there is any possibility of race conditions happening in this component:

import React, { useEffect} from 'react';
export default function UseEffectWithRaceCondition() {
const [todo, setTodo] = useState(null);
useEffect(() => {
const fetchData = async () => {
const response = await fetch('https://jsonplaceholder.typicode.com/todos/1');
const newData = await response.json();
setTodo(newData);
};
fetchData();
}, []);
if (data) {
return <div>{data.title}</div>;
} else {
return null;
}
}

We have specified an empty array as a dependency to the useEffect React hook. So we have ensured…


Image for post
Image for post

The best way to move forward towards achieving our dreams is to commit to them. And habits are the compound interest of self-improvement. But who wants a huge to-do list that we do not even look at it? Does anyone have a better way of doing it?

Yes, commitments and habits are hard. They can either work for us or against us.

But how do we make them effortless?

Let us explore research-backed answers by James Clear, which he shared in his book Atomic Habits: An Easy & Proven Way to Build Good Habits & Break Bad Ones.

According to…


Image for post
Image for post

I was recently working on a project in which I was trying to use a shorthand notation for destructuring assignment of a variable. I was researching different ways of getting a specific scenario to work. And while doing that research, I found that ES2015 had added 3 new object initialization shorthand notations that I had not known existed. And so I decided to share these with everyone.

Note: As with most good things, these do not work with Internet Explorer. …


Image for post
Image for post

The useCallback React hook is a useful hook that can help in optimizing the rendering performance of our functional React components. It is used to memoize functions which means it caches the return value of a function given a set of input parameters.

The syntax

const memoizedCallback = useCallback(
() => {
functionToBeMemoized(arg);
},
[arg],
);

As we can see, the useCallback React hook takes in an inline function and its dependencies as parameters and returns a memoized version of the function. The returned memoized function changes only when one of the passed dependencies has changed. …


As our application scales to multiple users, we need to start thinking about scaling our servers and applications with it. Load balancing is the activity of effectively distributing traffic load across multiple servers.

This is how we achieve highly available applications that help us achieve scaling effectively.

What is load-balancing?

Since nobody can afford a web server overload, we scale out our backend servers to multiple machines. The aim is to have a distributed architecture and to avoid having all users connecting to a single server and choke it up. Therefore we distribute the incoming traffic by making use of a load balancer.

Image for post
Image for post


Continuing our React hooks series, we will learn about the useRef react hook in this blog post.

Image for post
Image for post

Continuing our React hooks series, we will learn about the useRef React hook in this blog post.

The useRef React hook is useful in the following two situations:

  1. Accessing DOM elements directly inside React
  2. Store state values that do not trigger re-renders and are persisted across re-renders

Before we see these advantages of this hook, let us first understand what the hook is and what it does.

What is the useRef React hook?

The useRef React hook is a function that returns a mutable ref object. Refs are a way to access DOM nodes in React.

const refContainer = useRef(initialValue);

The .current property of the object…

saransh kataria

For over and over, I have failed & in the process of losing it all, I realized that I might actually win.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store