Found 10711 Articles for Web Development

Destructuring of Props in ReactJS

Prince Yadav
Updated on 26-Jul-2023 15:18:21

6K+ Views

ReactJS is a popular JavaScript library that has gained immense popularity in the last few years. It provides an efficient way to build complex user interfaces with reusable components. One of the essential features that make ReactJS a powerful tool is the way it handles props. Props are properties that are passed down to components, allowing for customization and dynamic rendering of data. Destructuring of Props is a feature in ReactJS that makes it easier to handle props in components. In this tutorial, we'll explore the concept of destructuring in JavaScript and how it can be used in ReactJS to ... Read More

if/else condition in CSS

Mohit Panchasara
Updated on 26-Jul-2023 12:59:12

3K+ Views

The CSS is useful for styling the content of web pages. We can access HTML elements differently and use various CSS properties to style the content. Sometimes, developers require to style a particular HTML element based on several conditions. For example, we allow users to submit the form on the web application. If the form is successfully submitted, we show the success message in green. Otherwise, we show the error message in red color. In this case, we need to change the style of the message element. So, we can achieve it using the if-else statement, but unfortunately, CSS doesn’t ... Read More

How to replace a string by another string in Angular JS?

Mohit Panchasara
Updated on 26-Jul-2023 12:57:29

815 Views

Angular JS is a popular JavaScript framework that offers developers a range of useful tools for creating dynamic web applications. A common requirement in web development is to change specific words or phrases within a given text. In this tutorial, we will explain how to replace one string with another using AngularJS. We will provide clear, step-by-step instructions to accomplish this task effectively. To make it easier to understand, we will use a practical example to demonstrate the powerful features of Angular JS for string replacement. Importance of Replacing a String Before we explore the technical aspects, let's first grasp ... Read More

How to prevent XSS with HTML/PHP?

Mohit Panchasara
Updated on 26-Jul-2023 12:52:45

413 Views

Cross-Site Scripting (XSS) is a major threat to web application security because it allows attackers to inject malicious scripts into reputable websites. This attack depends on innocent consumers, exposing important information or potentially gaining control of their accounts. Understanding and combating XSS threats is critical for maintaining a strong security posture as web applications become more complex and dynamic. In this article, we will dive into XSS attacks and look at possible prevention strategies. What are XSS Attacks? Cross-Site Scripting (XSS) attacks are a common security risk in web applications. Attackers take advantage of vulnerabilities in web pages to inject ... Read More

How to pass data into a bootstrap modal?

Mohit Panchasara
Updated on 26-Jul-2023 12:45:21

3K+ Views

Bootstrap is a CSS framework allowing developers to style HTML elements without writing any CSS code. We can use pre-defined classes of Bootstrap with HTML elements to style them. The Bootstrap also contains the modal. The simple meaning of the modal is the pop-up box. For example, an alert box, payment box, etc. In this tutorial, we will learn to add data to the bootstrap modal using JavaScript or JQuery. One scenario when we require to add data to the bootstrap modal is that we allow users to select any product. After that, we need to open a payment modal ... Read More

HTML width/height Attribute vs CSS width/height Property

Mohit Panchasara
Updated on 26-Jul-2023 12:40:47

256 Views

While developing web pages, many times, developers require to manage the size of different HTML elements such as image, div element, span element, etc. Developers can use the width and height CSS properties or HTML attributes to manipulate the dimensions of a particular element. In this tutorial, we will see the difference between the width/height HTML attribute and CSS properties. Width and Height HTML Attributes The width/height attributes in HTML are used for the presentation. It takes the width and height values in the ‘px’, ‘%’, etc. units but not in ‘rem’ units. Also, if we don’t define the unit ... Read More

How to record and play audio in JavaScript?

Mohit Panchasara
Updated on 26-Jul-2023 12:38:11

4K+ Views

Are you also willing to add a custom audio recording feature to your web application? If yes, you are in the right place, as we will learn to record and play audio using JavaScript in this tutorial. Some applications like Discord allow you to record the audio and store it inside that to play it anytime. The recorded audio can also be used as a meme for fun, alerts in the discord meetings, etc. We can also use the mediaRecorder API of JavaScript to add the recording audio feature to our web application. Here, we will learn a step-by-step guide ... Read More

How to put the text inside of a created icon?

Mohit Panchasara
Updated on 26-Jul-2023 12:36:34

482 Views

Sometimes, developers require to put the text in the icons. For example, adding the total number of likes inside the ‘like’ icon makes UI better, adding a comment inside the comment icon, showing a particular number in any icon, etc. In HTML, we can add the text and icon both separately. After that, we can set the position of the text to place them in the middle of the icon. In this tutorial, we will learn different examples of putting the text inside a created icon. Syntax Users can follow the syntax below to set the position of the text ... Read More

How to print a page using jQuery?

Mohit Panchasara
Updated on 26-Jul-2023 12:35:20

3K+ Views

Allowing users to print the web page can be a great feature in many scenarios. For example, users can print the invoice, the whole article if they are on the web page containing the blog, some important data, etc. The JQuery contains the print() method allowing us to print the HTML content of the web page by adding it into the pdf format. It opens the print pop-up, and when the user clicks the print button, it starts printing the page if the printer is connected. Otherwise, it saves the data in the local computer in the pdf file format. ... Read More

How to prevent text in a table cell from wrapping using CSS?

Mohit Panchasara
Updated on 26-Jul-2023 12:25:06

3K+ Views

In HTML, the table is useful to show the data in the formatted way on the web page. For example, we can show student, product, order, subscription, etc., data. Sometimes, we get lengthy data that we need to show in the table format. For example, product descriptions can be longer than other product information. So, In such cases, we must avoid wrapping text to the next line to maintain the table layout. We have a straightforward solution to avoid text wrapping in table cells, which is using the ‘white-space’ property of CSS. Syntax Users can follow the syntax below to ... Read More

Advertisements