Latest Javascript Tutorials and How-To's
javascript
How to Detect Change in Element Size with Javascript
Detecting an element for change in dimensions using JS can be done with the ResizeObserver interface. This is supported in all modern browsers.
May 11, 2020
javascript
Detecting Dark Mode with Javascript
Device dark mode can be checked in Javascript by using window.matchMedia() to check a match for the prefers-color-scheme: dark CSS media query.
May 9, 2020
javascript
Getting Property Value in a Deeply Nested Object (using ES2020 Optional Chaining Operator)
Property value in a deeply nested Javascript object can be found using the Optional Chaining Operator, introduced in ES2020.
May 4, 2020
javascript
Handling Error HTTP Responses in Javascript fetch
Failed HTTP responses can be handled in fetch() by checking whether the returned Promise was rejected due to a network error. Subsequently the Response.ok property needs to be checked for an invalid HTTP status code.
April 28, 2020
css
Creating a Slider / Carousel with CSS Flexbox (with infinite repeating items in loop)
A responsive slider / carousel can be created with CSS flexbox using the order property. Items can be repeated infinitely in a circular loop by changing the order property each time.
April 25, 2020
javascript
Reading a Text File from Server using JavaScript
A text file on a server can be read with Javascript by downloading the file with Fetch / XHR and reading the response as text.
April 22, 2020
javascript
Javascript File Uploading with Fetch, Async & Await
Javascript fetch method can be used to upload files to server. fetch is Promise-based, so we can use async / await to write synchronous styled functions.
April 13, 2020
javascript
Checking If CSS Property Supported in Current Browser with Javascript
With newer CSS properties not available in all browsers, it is sometimes required to check whether a CSS property & its value are supported in the current browser. This can be detected in Javascript using the CSS.supports() method.
March 13, 2020
javascript
Get Random Numbers, Cryptographically Secure, in Javascript
Random numbers that are cryptographically strong, can be generated in Javascript using the Web Crypto API.
March 9, 2020
javascript
Using formdata Event for AJAX Form Submissions
The newly introduced formdata event can enable the Javscript FormData object to participate in form submissions. When trying to submit a form via AJAX, this is helpful to include custom elements in the request.
February 3, 2020
javascript
Dynamically Rotating an Image using Javascript
An image can be rotated with Javascript by dynamically changing its CSS transform property. The point around which rotation needs to happen can be specified with the transform-origin property.
January 15, 2020
javascript
Managing the URL Hash with Javascript
The Javascript URL object can be used to get and set hash value of a given url. To detect a change in hash in the current url, the hashchange event can be listened to.
January 13, 2020
javascript
Reading a File and Getting its Binary Data in Javascript
The binary data of a local file selected by the user can be retrieved using the readAsBinaryString method of a FileReader object.
January 9, 2020
javascript
How to Check if Cookies are Enabled or Disabled
Without cookies being enabled in the browser, some web applications may not work as expected. To prevent such cases navigator.cookieEnabled property can be used to do a prior check whether cookies are enabled or not.
January 6, 2020
javascript
Checking for a Secure Context Before Running User Sensitive Code
Browsers allow user-sensitive and low-level web APIs to execute only when the page is in a secure context. In addition, the window.isSecureContext property can be used to check whether the current environment is safe or not.
January 3, 2020
javascript
Filling an Array with a Given Value in Javascript
The Array.fill() method can be used to fill an array with a specific value, starting from a given index and ending upto another index.
December 22, 2019
javascript
Flatten Array Containing Arrays in JavaScript
Flattening an array refers to the process taking an input array, which may itself contain n-dimensional arrays as its elements, to a single array. This can be done in Javascript using the flat() method.
December 20, 2019
javascript
Format Number as Currency in Javascript
The Intl.NumberFormat object can be used to format a number as a currency using Javascript. Various options can be set to customize format of currency code, comma / decimal separators etc.
December 18, 2019
javascript
Knowing whether Promise is Completed (either Fulfilled or Rejected) with finally() Callback
The finally() callback can be used to know whether the Promise was settled. We don't care whether it was resolved or rejected.
December 17, 2019
javascript
Setting Default Values to Variables if null or undefined (using ES2020 Nullish Coalescing Operator)
The nullish coalescing operator has been newly introduced in Javascript. This can be used to give default values if a variable is either null or undefined.
December 16, 2019
New & Upcoming Javascript / Web Platform Features
Pan / Tilt / Zoom Support for Camera in getUserMedia()
Javascript Logical Assignment Operators
Intersection Observer Now Also Accepts a Document as the Root Element
Javascript String.replaceAll() Method
Better Caching With stale-while-revalidate Directive in Cache-Control Header
Synchronous AJAX Will Not Work in Page Dismissal Events
Javascript globalThis Property
Javascript Hashbang Comment Syntax