When you are working with React, you will often times need to render lists of items. In React, you can use the map() method to iterate over an array and create a list. Let’s see how to do that now. What Is JavaScript map() Method? The map() method is used for array transformation. It takes… Continue reading How to Render Lists in React using map Method
Category: Web Development
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
The Guide to Nested Routes with React Router
We use nested routing in our React application so that a parent component has control over its child component at the route level. In this tutorial we will learn how to use Nested Routes with React Router. In order to get you started, create a new React project. Afterward, install React Router and read the… Continue reading The Guide to Nested Routes with React Router
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
A Complete Beginner’s Guide to React Router
React Router is a third-party library that enables routing in our React apps. In this tutorial, we are going to cover everything you need to know to get started with React Router. Setting Up The Project To be able to follow along, you will need to create a new React app by using Vite. 📣… Continue reading A Complete Beginner’s Guide to React Router
How To Style And Write CSS In React
As a React developer, you will usually be working on styling your React application. In this detailed tutorial on CSS in React, we will walk you through the various methodologies through which you can style the React application with CSS. So, let’s get started! How to Style Your React App Styling is one of the… Continue reading How To Style And Write CSS In React
A Gentle Introduction to Refs in React (useRef Hook)
In this tutorial, you will learn how to get access to the actual DOM in React using so-called refs. To do that, we will take a look at what refs are and when and how to use them. Let’s get started! What are Refs in React When working with React, we are typically manipulating the… Continue reading A Gentle Introduction to Refs in React (useRef Hook)