I'm a Senior Full Stack Developer with 10+ years of experience. I strive to be a humble team player and be approachable to receive and give feedback.
I was in the middle of writing a unit test case for some service built-in JavaScript using Jest. We need to mock data instead of actually having a connection using a database instance. In particular model response json data, I need to search for a pa...
Today, while doing my day-to-day tasks, I come to observe that my API call in useEffect runs twice, I knew that it was re-rendering because of the local state changes inside the component, but it was not the case, in the first place the useEffect was...
While working with React library, you already understand well that whenever any props value or state of that particular component changes then it re-renders and displays the latest data to the screen. It has been also observed that any child componen...
Early Return Early Return is a pattern that suggests we avoid nested if-else statements by checking the preconditions and return or throw as early as possible. Usually, Early Return is also called Gaurd Clause or Bouncer Pattern. Contrived Example //...
Using Inline Ternary Operator Conditionally Spreading the Object Properties We can use ternary or logical && operator, along with the spread operator, to conditionally add props to a component like so: <Tooltip message={message} // usin...
1. Know it's an array or not const points = [23, 3, 89, 98, 40] // Before 😏 console.log(points.length) // it returns true // After 👌 console.log(Array.isArray(points)) // it returns true 2. Get last element of an array const points = [23, 3, 89, ...
There are multiple ways to mock an event handler in Jest Testing Framework. I will discuss two different scenarios and further, we will introspect each case. Scenario1: Component accepts event handler as a prop export const ProductView = ({ product, ...
Recently, I've got a chance to work on a project which is a huge project, an e-commerce application developed with React as a view layer. There were multiple teams with diverse backgrounds under one hood working together towards a common goal. I can ...
Represent the most granular level of UI i.e. grid, buttons, input boxes, colors, fonts Ensure that design changes are propagated across digital assets Enable the solution to scale to multiple regions, brands, products, and customer segments