Posts by Devsheet

Read all articles posted by Devsheet programmers and content writers.

Create a Modal Popup Component in React

Creating a modal popup component in React is a great way to add a user-friendly, interactive element to your website or application. A modal popup is a dialog box that appears on top of the current screen, allowing users to interact with the content within it.

Create a tab component in React

Welcome to this tutorial on creating a tab component in React. Tabs are a common UI element in web applications and can be used to organize and present content in a clear and user-friendly way.

Render a string as HTML in React

If you're working with React and you need to render a string as HTML, there are a few options available to you. You can use the built-in dangerouslySetInnerHTML prop, you can use a third-party library like DOMPurify, or you can write your own function to handle the conversion. Whichever option you choose, be sure to take care when handling user input, as it's possible for malicious actors to inject code into your app that can wreak havoc.

Create a searchable list in React

React is a powerful JavaScript library that helps developers create user interfaces and websites. When it comes to creating a searchable list, React provides a great solution. This article will show you how to create a searchable list in React without using any library.

How to Filter an Array of Objects in React

When working with data in React, it is often necessary to filter an array of objects. There are many ways to do this, but in this article, we will discuss how to filter an array of objects in React using the native filter() method.

Highlight the highest value list item using React

React is a popular JavaScript library for building user interfaces. When working with data in React, it is often necessary to highlight the largest value in a list. This can be accomplished using the built-in Math.max() function.

Loop through an object using map in React

When working with data in React, there may be times when you need to loop through an object in order to render a component for each key-value pair. In this article, we'll look at how to do that using the built-in map() function.

How to use loop in React JSX

The best way to use a loop in React JSX template is using map function or you can also implement loop using javascript for loop in React JSX template.

Deploy React application from subdirectory

The code snippet shows how to deploy your React application from a sub-directory or folder

Render item condition based React

We use the if else condition statement to implement something condition-based. In React you can render HTML components based on different condition using below code.

Get index in map React

The map() function is a built-in JavaScript function that can be used to iterate over arrays and objects. The map() function can be used with React to track the index of an element in an array. The index can then be used to get the value of the element at that index. The map() function will return a new array with the index of the element as the first element and the value of the element as the second element.

Loading more...
Search all posts...