Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
Front End Technology Articles
Page 190 of 652
How to use Material-UI with Next.js?
Material-UI is a popular React-based UI library that provides a wide2 range of UI components and design elements. Next.js is a React-based framework for building server-side rendered (SSR) and statically exported web applications. In this tutorial, we will learn how to use Material-UI with Next.js to create a user-friendly, modern and responsive user interface. Steps to integrate Material-UI with Next.js Users can follow the steps below to use Material-UI with NextJS. Step 1 − Start by creating a new Next.js project using the following command − npx create-next-app my-app Step 2 − Navigate to the newly created project ...
Read MoreHow to solve “Process out of Memory Exception” in Node.js?
"Process out of Memory" is an error that occurs when a Node.js program tries to use more memory than the system has available. This can happen when the program grows too big or runs for too long and can cause the system to stop working properly. To prevent this error, we may need to limit the amount of memory our program uses or find ways to optimize its performance. In this tutorial, we will learn about the "Process out of Memory Exception" in Node.js, what causes it to occur, and how to solve it. We will also explore some ...
Read MoreHow to create Emoji Picker in NextJS?
Emojis have become an essential part of modern communication. In this tutorial, we will learn how to create an emoji picker in NextJS, a popular React-based framework for building server-rendered applications An emoji picker is a UI component that displays a collection of emojis and allows users to select one or more emojis for use in their text. A well-designed emoji picker can improve the user experience and increase engagement on your site. In this tutorial, we will create an emoji picker that displays a grid of emojis and updates the selected emoji in the state. Steps to create ...
Read MoreHow to show LinearProgress in ReactJS?
The linear progress bar is often used to show download and upload percentages in the application. We can show the upload or downloaded completion percentage using the linear progress bar. Also, it improves the UX of the application as it shows progress with animation. In this tutorial, we will learn to show linear progress using the Material UI progress bar and custom progress bar. Use the Material UI to show the LinearProgress bar in ReactJS Users can use the below command in the React application to install the Material UI library. npm install @mui/material @emotion/react @emotion/styled ...
Read MoreHot Reload in ElectronJs
Hot reloading is a powerful feature in ElectronJS that lets developers quickly view their code changes in real time without having to restart the application. It makes the development process faster and more efficient by reducing the time and effort required to test changes. Steps to Implement Hot Reload in ElectronJS The hot reloading feature is implemented using a library called “electron-reload”, and it can be easily integrated into an Electron JS application by following a few simple steps. Users can follow the steps below to implement hot reload in Electron Js − Install the electron-reload module The first step ...
Read MoreHow to create own Ajax functionality?
An Ajax (Asynchronous JavaScript and XML) request is an HTTP request made using JavaScript, typically with the XMLHttpRequest object, to exchange data with a server and update a specific part of a web page without requiring full page refresh. There are two ways to create own Ajax functionality. You can use JSONPlaceholder API or your own file. We will discuss these two ways in detail in this tutorial. Using JSONPlaceholder API JSONPlaceholder is a free online REST API that you can use to test and practice your development skills Syntax Users can follow the below syntax for creating an ...
Read MoreHow to show Page Loading div until the page has finished loading?
Rather than showing the whole white or black screen while loading the page, it is better to show the loading indicator, which also improves the UX of the application. Nowadays, there are some libraries available to show loading indicators. However, we can use HTML and CSS to create a customized loading indicator div. In this tutorial, we will use HTML, CSS, and JavaScript to show page loading div until the page has finished loading Use the onreadystatechange event to show the loading indicator while loading the page In JavaScript, the onreadystatechange event triggers whenever the state of the web ...
Read MoreHow to serialize a cookie name-value pair into a Set Cookie header string in JavaScript?
The cookie allows us to store users’ data in the web browser for quick response. For example, when a user opens the profile page in any web application, the web page receives the data from the server. The server also sends the cookies containing the data to store in the web browser. When a user goes on the profile page again, it fetches the data from the cookie rather than fetching it from the server to load the webpage quickly. To get data browser looks in the cookie first, and if it doesn’t find data stored in the cookie, it ...
Read MoreHow to check an array is empty or not using jQuery?
Overview In jQuery, we can easily check whether an array is empty or not by using multiple methods. The collective way includes length property and as in JavaScript arrays are the object so using the jQuery alias symbol $.isEmptyObject(objName). An array is a collection of elements. So to achieve our goal, we should have some prior knowledge about the syntax of jQuery and how to manipulate the HTML. It is necessary to write the “$” with isEmptyObject() method as “$” is the main library of the jQuery which contains various method as isEmptyObject(), isArray(), isFunction() and many more. In all ...
Read MoreHow to check an element exist or not in jQuery?
Overview We can check for an HTML element such as , , etc that they exist in the HTML page or not using jQuery. To achieve the solution, we have the "length" property of jQuery, which checks the specific element in the HTML document and returns the length of the particular element, which is the number of times that element is present in the HTML body. The length property is present in the jQuery ($) main library. Syntax The syntax used in this program is − $(elementName).length; elementName −The elementName can be any tag, class name, id name ...
Read More