Found 8894 Articles for Front End Technology

How to create a revealing sidebar using HTML, CSS, and JavaScript?

Naveen Singh
Updated on 16-Aug-2022 08:12:02

1K+ Views

In this tutorial, we will see different approaches to finding unique characters in a string. Simply say when a character once occurred in the string then it will not be included in the string again. Approach We will follow the below steps to create our design − STEP 1 − We will create our necessary HTML elements like home, icon, dashboard, and more options which will be present inside the sidebar. STEP 2 − Then we will design our HTML elements using CSS and we will fix them at their correct positions, in this tutorial we will use internal CSS ... Read More

What are the different use cases of remainder operator (%) in JavaScript?

Naveen Singh
Updated on 16-Aug-2022 08:07:00

329 Views

In this tutorial, we will see the different use cases of the remainder operator (%). The % operator is also known as the modulo operator. This operator returns the remainder when a number is divided by the second. It takes the sign of the dividend. What is Remainder? From the division formula dividend / divisor = quotient quotient. When the dividend is not completely divisible by the divisor then there is always a remainder. So, in case our quotient is an integer then our remainder will always be zero. For example 10 / 2= 5 here no remainder is there ... Read More

How to design a Loan EMI Calculator using HTML, CSS and JavaScript?

Naveen Singh
Updated on 16-Aug-2022 07:58:50

8K+ Views

In this tutorial, we will learn about the design and working of a loan calculator using JavaScript. This calculator will simply tell us about our monthly EMI based on the loan amount, interest rate, and month. We will make the UI using HTML and will apply the styling using internal CSS then we will apply the functionality to calculate EMI using JavaScript. HTML Firstly, we will create a div block that will have three input boxes. All the boxes will be for the loan amount, rate, and time respectively. Then a button and an output field will be there for ... Read More

How to truncate an array in JavaScript?

Naveen Singh
Updated on 16-Aug-2022 07:22:09

2K+ Views

This tutorial is going to be about truncating an array in JavaScript. Truncating an array means trimming some elements from the end and assigning back the new value of the truncated array to the actual array. Sometimes we need to truncate an array. Suppose in a case, there is an array in which sorted (descending order) elements are there, and now we need only the first k sorted element from the array and delete the else value. So we don’t need to create an extra array and modify that and assign it to the actual. There are many ways to ... Read More

What is Promise Chaining in JavaScript?

Naveen Singh
Updated on 16-Aug-2022 07:17:48

1K+ Views

In this tutorial, we will talk about promise chaining in JavaScript. Before moving to promise to chain let’s first talk about what is Promise So, as we know JavaScript is single-threaded which means that no two functions will be allowed to run at the same time as we have only one call stack like below which has a function to execute when one function completes its execution then another function starts executing so to achieve two or more functions running at the same time we use asynchronous programming in JavaScript example- setTimeout function which takes a call-back function and specified ... Read More

How to find unique characters of a string in JavaScript?

Naveen Singh
Updated on 16-Aug-2022 06:52:49

3K+ Views

In this tutorial, we will see different approaches to finding unique characters in a string. Simply say when a character once occurred in the string then it will not be included in the string again. Example Input tutorialspoint Output tuorialspn Method 1: Using the Set So, in this approach, we will use a set data structure as you know it contains only unique elements inside it. So, we will take input from the user then we will convert that into an array by splitting then we will create a new ... Read More

How to uncurry a function up to depth n in JavaScript?

Naveen Singh
Updated on 04-Aug-2022 11:50:37

115 Views

In JavaScript, a function is considered "curried" if it takes one or more arguments and returns a new function that expects the remaining arguments. Currying is a powerful technique that can be used to create new functions from existing ones, or to "uncurry" a function up to depth n. Why do we uncurry a function? There are several reasons why you might want to uncurry a function. For example, you may want to − Use a curried function in a context where a non-curried function is expected Convert a curried function to a non-curried form to make it easier ... Read More

How to clone a given regular expression in JavaScript?

Naveen Singh
Updated on 04-Aug-2022 11:49:04

242 Views

JavaScript's regular expression support is widely considered to be among the best in the world, but there's one area where it's lacking: there's no built-in way to clone a regular expression. This can be a problem when you need to create a new regular expression that is similar to an existing one but with a few small changes. The problem is that regular expressions are objects, and as such, they cannot be copied by simply assigning one to another. Consider the following code − var regex1 = /foo/; var regex2 = regex1; regex2 === regex1; // true In this ... Read More

How to design a video slide animation effect using HTML CSS JavaScript?

Naveen Singh
Updated on 04-Aug-2022 11:46:31

1K+ Views

In this tutorial, we will be discussing how to create a video slide animation effect using HTML, CSS, and JavaScript. This can be used to create a simple yet effective way to grab attention and engage viewers. Applying the Animation Effect To apply the animation effect, we will be using a keyframe rule. This will tell the browser to change the CSS properties of an element over a period of time. In our case, we want the video to slide across the screen, so we will be using the transform property. What is the Keyframe Rule? The keyframe rule is ... Read More

What are the attributes that work differently between React and HTML?

Naveen Singh
Updated on 04-Aug-2022 11:45:25

184 Views

React and HTML have different ways of handling attributes. In React, some attributes are treated as JavaScript, while in HTML they are treated as strings. This can lead to confusion when working with React and HTML together. Why React Treats Some Attributes as JavaScript? React treats some attributes as JavaScript because they are used to modify the behavior of the component. For example, the "onClick" attribute is used to add an event listener to the element. In React, this attribute is treated as JavaScript, not as a string. How This Affects Working with React and HTML? This difference in handling ... Read More

Advertisements