Josh W. Comeau: Because sound is used so rarely on the web, it can be quite impactful. It’s a bit of a secret weapon, and it can make a surprisingly big difference for the right kinds of projects! To make it a bit easier to get started, I pulled out the hook I built for […]
Tag Archives: javascript
Pass Data from CSS to JavaScript with CSS Variables
What happens when you combine the fact that part after the : for CSS Custom Properties doesn’t need to be valid CSS with window.getComputedStyle()? You get a way of passing data – including Arrays, Objects, and even JSON – from CSS to JavaScript. Psst… Hey kid… Did you know you can pass data from your […]
Playing With Particles Using the Web Animations API
Louis Hoebregts writing for CSS-Tricks When it comes to motion and animations, there is probably nothing I love more than particles. This is why every time I explore new technologies I always end up creating demos with as many particles as I can. In this post, we’ll make even more particle magic using the Web […]
Fun with browsers: how to get an image into the current page
Christian Heilmann created a demo page where a user can add an image to the page through various ways. I gave myself the task to build an interface to make it as easy as possible for a user to add an image into the document. I wanted to support: Image upload Drag and Drop Copy […]
classnames-components – A classnames component wrapper to speed up styling React components
Geoffrey has created a handy package to quickly create React components that are built of an element with some CSS classes applied to them. Handy for when you’re working with CSS libraries such as Tailwind. import cc from 'classnames-components'; // using arguments const Header = cc('h1')('font-sans', 'text-3xl'); // using an array const Intro = cc('p')(['font-serif', […]
Easily install local NPM packages by simply referring to their local path
Directly installing a package with npm install and referring to its local path is a quick way to work with a local package. To be safe though, the usage of npm link is still recommended. To work with local NPM packages on can reside to using npm link. You make a package available locally with […]
gqless – A GraphQL client without queries
Now this is a step forward: gqless is a fundamentally new approach to a GraphQL client. It makes using your API enjoyable, by generating queries at runtime based upon the data your app consumes. Here’s an example app of it in action. Notice how the data it fetched automagically, depending on what is to be […]
Listen to your Web Pages
Always notice how in sci-fi movies the computers make those weird bleepy sounds? Tom Hicks has created a JavaScript snippet that combines MutationObserver with AudioContext to recreate that effect. Copy this into the console of any web page that is interactive and doesn’t do hard reloads. You will hear your DOM changes as different pitches […]
Can I Unicode‽ Unicode support across JavaScript engines
Small site by @mathias (who else?) on the Unicode support in browsers their JavaScript engines. Changes in the Unicode Standard can affect the JavaScript language. This page gives concrete examples and tracks which exact Unicode version each browser supports for each feature. What surprises me is that some engines support different Unicode versions per feature. […]
Understanding the ECMAScript Spec
Over at the V8 blog, Marja Hölttä has published some posts on how to read the ECMAScript Specification: Even if you know JavaScript, reading its language specification, ECMAScript Language specification, or the ECMAScript spec for short, can be pretty daunting. At least that’s how I felt when I started reading it for the first time. […]