-
Listening to user input using JavaScript
You can listen to user inputs using various methods in JavaScript. Some of the most popular ones are given here with examples : Example 1 The value keyword can be used to capture the user input inside the DOM. Here’s how it works : Inside the JavaScript code block above you’ll see that we’ve used…
-
To Do List in JavaScript – Explanation
I’ve created this fully functional To-Do-List code in JavaScript and explained how each line of code works within the comments in this document. JavaScript Logic Here’s a simple and beginner friendly way to write the logic. First, the HTML file is given below : The HTML file above is pretty simple. Note that there’s a…
-
All about Props in React Components
What are Props? Props are a way for React components to communicate with each other. Props are essentially used to pass data from one component to the other viz-a-viz a parent and a child component. These are information you can pass through a JSX tag/syntax. You can pass any JavaScript values through props like objects,…
-
Everything you need to know about JSX
What exactly is JSX? JSX is simply HTML code inside of a JavaScript function. In a React application, we use components and inside components we write a JavaScript function. Inside the function we write codes using the JSX syntax to make the code work. JSX syntax looks a lot like regular HTML, but are stricter…
-
How to write your first React component
What exactly is a React Component? Components are actually pieces of your User Interface(UI) in React. These reusable UI elements of your React App called components consists of markup(HTML), CSS and JavaScript under the hood. In a React App, every part of your UI is actually a component. These components may be a button, a…
-
Callback functions in JavaScript
To understand callback functions let’s write some very simple functions and see the expected output first : Example 1 Expected output of the above : Example 2 Expected output of the above : In both the examples above you can see that we have the same functions and we have only called the first and…
-
What is box-sizing : border-box in CSS?
Introduction This property specifies the behaviour of the width and height of a container, more specifically a div. To understand this property you have to use it on more than one div elements which stack on top of each other, or, on div tags which are in a parent-child hierarchy. Explanation with examples Example 1…
-
How to run JavaScript codes inside VS Code
You can run JavaScript codes inside the Visual Studio Code’s in-built terminal. This saves time since you don’t have to open up an external browser every time to test-run your codes. Here are the steps involved : Step 1 You have to first check whether NodeJS is installed on your system. To check, just type…
-
How to Work with Strings in JavaScript
Basics The various string methods in JavaScript are given here with examples : To change the case of a string : How to replace parts of Strings Here’re some examples to do so: We can also use replaceAll method to replace more than one occurrences in a string : Regular expressions can also be used…
-
Maps in JavaScript : Fundamentals with Practicals
The Map is a data structure that maps values to keys. Data is stored inside a key value pair in Map. However, Maps and Objects are different. In objects, keys are generally strings(or symbols) but in Maps there can be any type of keys (objects, strings, arrays or even other maps). To create a new…
