Create COVID-19 Country Wise Status Project Using REST API

Shubham Vora
Updated on 28-Feb-2023 17:28:35

360 Views

Before creating the project, we will first discuss REST API. REST is a software architecture style and a collection of standards that helps make online services. Representational State Transfer is the full name of REST. At the same time, Application programming interfaces (API) allow communication between two or more computer programmes. It is a software interface that gives other software programmes a service. The user must follow the rules known as a REST API based on the HTTP (Hypertext Transfer Protocol) to access web services. Conventional HTTP methods like GET, POST, PUT, and DELETE access and modify resources like ... Read More

Shorthand for document.getElementById Method in JavaScript

Shubham Vora
Updated on 28-Feb-2023 17:27:44

1K+ Views

The document.getElementById() method allows us to access any HTML element using its id in JavaScript. Every webpage can contain only a single HTML element with a single id. You can use the below example code to access any HTML element using its id. let element = document.getElementById('id'); In the above code, we used the getElementById() method of the document object and passed the id as a parameter. Now, if we require to access multiple elements using their id, it is not a good idea to use a document.getElementById(), but we can create a shorthand for it and ... Read More

Write Inline If Statement in JavaScript

Shubham Vora
Updated on 28-Feb-2023 17:23:39

8K+ Views

Conditional statements are the most important and basic concept of any programming language. The if-else statement allows us to execute any code block conditionally. We can define the condition for the if statement in braces, and if the condition becomes true, it executes the code of the if block; Otherwise, it executes the code of the else block. Here, we have demonstrated how an if-else statement works in JavaScript. if (condition) { // code to execute when the condition becomes true } else { // ... Read More

Write Cell Phone Number in International Format using JavaScript

Shubham Vora
Updated on 28-Feb-2023 17:21:18

653 Views

When you have visitors from worldwide on your websites, it is a good idea to show things like a cell phone number according to international standards. So they can easily understand. We can use the International Public Telecommunication Numbering Format to represent the cell phone number in an international way. Also, it is represented by the ‘E-164’ format. We have given the syntax below to follow to write a cell phone number in an international way. [+] [country code] [local phone number] Users can see that the international phone number contains ‘+’ initially and ‘country ... Read More

Wrap setTimeout Method in a Promise

Shubham Vora
Updated on 28-Feb-2023 17:20:12

8K+ Views

The setTimeOut() method executes some block of code or functions after a particular number of milliseconds. Sometimes, we require to resolve or reject the promise after a particular delay, and we can use the setTimeout() method with the promises. In JavaScript, a promise is an object that returns the result of the asynchronous operation. Here, we will learn to resolve or reject promises after some delay using the setTimeOut() method. Example 1 (Promises without setTimeOut() method) In the example below, we have used the Promise() constructor to create a new promise. The promise constructor takes a callback ... Read More

Wait for Resize End Event and Perform Action using JavaScript

Shubham Vora
Updated on 28-Feb-2023 17:18:50

3K+ Views

Whenever we resize the web page window, it triggers the ‘resize’ event by default. The ‘resize’ event triggers multiple times while resizing the window. Sometimes, we require to execute some JavaScript code only once when resize event completes. In such cases, we must use the setTimeOut() method with the resize event to execute JavaScript code or function once the event completes. Also, we require to use the clearTimeOut() method. Syntax Users can follow the syntax below to wait resize event completes and then perform an action using JavaScript. window.addEventListener('resize', () => { ... Read More

View Array of a Structure in JavaScript

Shubham Vora
Updated on 28-Feb-2023 17:17:38

407 Views

The easiest way to debug the JavaScript code is using the console.log(), which many developers use. Sometimes, we require to know the array's structure and stored values for the debugging purpose. In this tutorial, we will learn to view the array of structures. Various methods of JavaScript allow us to check the structure of the array. For example, we can know if the array contains an object, nested array, string, number or Boolean values. Use the JSON.stringify() Method The JSON.stringify() method allows us to convert the JSON objects into the string. An array is also an object ... Read More

Create Refs in ReactJS

Shubham Vora
Updated on 28-Feb-2023 17:14:40

451 Views

In ReactJS, refs are used to referring any node of the document. Generally, we can pass the props to children elements to interact with children from the parent’s state. Still, sometimes the child component is out of the typical dataflow of components. For example, we have four components, and dataflow is second is a child of the first, third is a child of the second, and fourth is a child of the third component. To interact with the fourth component from the first component, passing props from every component is not good practice. So, we can use refs to interact ... Read More

Create Progress Bar in ReactJS

Shubham Vora
Updated on 28-Feb-2023 17:13:27

10K+ Views

We can use the progress bar to track how many percentage of a particular task is completed. Maybe you have seen the progress bar on many websites while uploading a file, and it is one of the best use cases of the progress bar to show the uploaded percentage of uploading the file. Another best use case of the progress bar is showing the download completion percentage. We can use different CSS styles for the progress bar to animate and improve user experience. In this tutorial, we will learn to create a progress bar using libraries and from scratch ... Read More

Create Phone Numbers and Contacts List in ReactJS

Shubham Vora
Updated on 28-Feb-2023 17:11:44

910 Views

We can assume that you have used mobile devices to call someone and seen the contact list. Generally, when you open the phone book on most mobile devices, it will show you three sections. The first is a keypad to dial a custom number, the second is recent calls, and the third is saved contacts in the device. The recent contact section shows recent calls with names, numbers, and call duration. The normal contact list section shows your contact name with your contact number. Here, we will design a contact list in ReactJS using the basic functionalities of ReactJS. ... Read More

Advertisements