JavaScript Kicks - JSK Daily for Dec 13, 2021

Sandpack is a live coding environment that runs on the browser. It is made by the team behind CodeSandbox. The main objective here is to provide interactive examples to play around with, to users. I see it being widely used in things like blog posts and documentation (in fact ...

Anish De

In this post, we will look at the various ways of creating a React web application from simple to complicated. React.js is an open-source JavaScript library created by Facebook in May 2013. It is......

Trung Anh Dang

In this coding tutorial, you'll learn how to recreate an interactive pixel distortion effect using Three.js. In this ALL YOUR HTML stream and coding session we'll be recreating the interactive pixel distortion effect seen on the website for the music video covers of "Infinite ...

Codrops

Node.js now supports a node: protocol for built-in modules. Previously: Now: What are the benefits of using node: module specifiers? It's immediately clear that a built-in Node.js module is imported. Given how many of them there now are, that's useful information....

Axel Rauschmayer

The addition of the async and defer attributes for the element were extremely helpful for lessening the impact of non-critical JavaScript resources on the HTML parsing process. Many vendors ask to include their JavaScript at the top of the , and when challenged about poten...

Robert Boedigheimer

import.meta is an object available inside of an ES module that contains useful information about the environment in which the module runs. import.meta object is extensible, and the host can write any useful information into it. Let's see what useful information about the modul...

Dmitri Pavlutin

Working in a monorepo comes with a long list of pros, and a few cons. One of the most painful cons, when it comes to working in a specifically JavaScript based monorepo, is the pain that comes from hoisting. As we all know, node_modules is a deep dark place with lots and lots ...

Jonathan Creamer

Rich Harris joins Amal & Amelia for a Svelte deep-dive! What's it all about? Why might you pick it over React and friends? What up with SvelteKit? Rich is working on it full-time now?! Will even more questions be answered?...

JS Party

Last week we talked about how small decisions can lead to big changes in your codebase. We used null-checks as an example but didn't explain why those are bad. It's about exploding complexity. Take a basic React component for example. It takes a user and renders their info....

Swizec

Whether it's about a simple landing page, an e-commerce app platform or your company's internal dashboard, using a library of pre-made icons and components is highly beneficial. There are many other icon libraries out there which can ease your work but one of the largest and t...

JavaScript In Plain English

React is a robust framework that helps build seamless single-page applications. Building user interface features in React is not just enjoyable but straightforward as well. In this tutorial, we will show you how to create a stepped area chart in React application from scratch....

Digamber Singh

Making debugging failed tests easier by adding timestamps to the information. Sometimes a test fails due to some API service failing to work. You need to debug the service logs, the first piece of information you need is to know when the failure has happened....

Gleb Bahmutov