Many a time, we use tools to convert px to a relative unit such as em or rem. Yet, we get weird-looking decimals like 0.9375rem. Problem is, afterward, it’s hard to know if 0.9375rem is 13px, 14px, or something else. The 62.5% font-size trick helps us use a pixel value along with a relative unit.… Continue reading Elevate Your Design with the 62.5% Font Size Mastery
Tag: Web development
Component Props in React – Beginner’s Guide
To start using React you don’t have to learn a lot. Learn the concept of components, state, props, and hooks — and you know how to use React. In this blog, we will learn what are props in react and how we can use them in our application to use dynamic data. We will also… Continue reading Component Props in React – Beginner’s Guide
React Conditional Rendering – Explained with Examples
Sometimes we want to show a React component when a condition yields true. It is called Conditional Rendering. It is a powerful tool for creating dynamic and engaging user interfaces in React applications. In this article, you will examine various ways to implement conditional rendering in React applications. What Is React Conditional Rendering? In React,… Continue reading React Conditional Rendering – Explained with Examples
ES6: JavaScript Spread Operator (…) – From Beginner to Expert
JavaScript ES6 provides a new operator called spread operator that consists of three dots (…). Though conceptually the spread operator is always used to “expand” an array or iterable object, the exact usage and behavior varies a bit based on the context. In this post, we will look at JavaScript’s spread operator, and the many different… Continue reading ES6: JavaScript Spread Operator (…) – From Beginner to Expert
Unique Keys in React 🔑: An Introduction
This article unravels the mystery behind the “unique key” warning message often appearing in React projects. It discusses its importance and demonstrates how to add and create unique keys effectively! What are React Keys? When working with any type of list in React, you will often encounter this warning if you forgot to include a… Continue reading Unique Keys in React 🔑: An Introduction
JavaScript Loops Explained With Examples (For Loop, While Loop, Do…while Loop, and More)
Loops are used in JavaScript to perform repeated tasks based on a condition. Conditions typically return true or false. A loop will continue running until the defined condition returns false. Many JavaScript developers are familiar with loops, but not everyone understands how they work and why or when they should use a specific type of loop.… Continue reading JavaScript Loops Explained With Examples (For Loop, While Loop, Do…while Loop, and More)
React useCallback Hook : A Quick Guide
In React useCallback hook is a built-in hook that optimizes the performance of functional components by memoizing callback functions. It allows us to prevent unnecessary re-rendering of child components when the parent component re-renders. In this blog post, we will dig deeper into useCallback hook. You will know exactly how and when to utilize the… Continue reading React useCallback Hook : A Quick Guide
JavaScript ES6 : Master Destructuring Assignment (Array & Object)
JavaScript ES6 provides a new feature called destructing assignment that allows you to destructure properties of an object or elements of an array into individual variables. This article aims to show you exactly how array and object destructuring assignments work in JavaScript. So, without any further ado, let’s first get started with array destructuring. What Is… Continue reading JavaScript ES6 : Master Destructuring Assignment (Array & Object)
Exploring MUI Theming Options: Customization Made Easy
Material-UI (MUI) is a React UI framework that follows the principles of Material design. Material design is a design system created by Google. In this article we will cover the mysteries of MUI Theming. We will explore what it is, why it’s useful, and how you can wield it to create stunning, consistent, and highly… Continue reading Exploring MUI Theming Options: Customization Made Easy
Quick Tutorial – JavaScript map Method 🚀
The map() method creates a new array with the results of calling a function for every array element. In this tutorial, you will learn how to use the JavaScript Array map() method to transform elements in an array. What is map() method in JavaScript? The map() method is used for array transformation. It takes another… Continue reading Quick Tutorial – JavaScript map Method 🚀
useMemo Hook : Performance Optimization Hook For React App ⚡️⚡️
From time to time React components have to perform expensive calculations. For example, given a big list of employees and a search query, the component should filter the employees’ names by the query. In such cases, with care, you can try to improve the performance of your components using the memoization technique. In this post,… Continue reading useMemo Hook : Performance Optimization Hook For React App ⚡️⚡️
React useReducer Hook – Manage App State Better
useReducer hook is an alternative to the useState hook, useReducer helps you manage complex state logic in React applications. When combined with other hooks like useContext, useReducer can be a good alternative to Redux. In certain cases, it is an outright better option. In this tutorial, we will explore the useReducer hook in depth, reviewing… Continue reading React useReducer Hook – Manage App State Better