JavaScript News

Making My Netlify Build Run Sass

June 9th, 2020

Let’s say you wanted to build a site with Eleventy as the generator. A popular choice these days! Eleventy doesn’t have some particularly blessed way of preprocessing your CSS if that’s something you want to do. There are a variety of ways to do it and perhaps that freedom is part of the spirit of…

How to Get All Custom Properties on a Page in JavaScript

June 8th, 2020

We can use JavaScript to get the value of a CSS custom property. Robin wrote up a detailed explanation about this in Get a CSS Custom Property Value with JavaScript. To review, let’s say we’ve declared a single custom property on the HTML element: html {   –color-accent: #00eb9b; } In JavaScript, we can access…

How I Used Brotli to Get Even Smaller CSS and JavaScript Files at CDN Scale

June 5th, 2020

The HBO sitcom Silicon Valley hilariously followed Pied Piper, a team of developers with startup dreams to create a compression algorithm so powerful that high-quality streaming and file storage concerns would become a thing of the past. In the show, Google is portrayed by the fictional company Hooli, which is after Pied Piper’s intellectual property….

Responsive web design turns ten.

May 27th, 2020

Ethan on the thinking and research that inspired the term: Around that time, my partner Elizabeth visited the High Line in New York City shortly after it opened. When she got back, she told me about these wheeled lounge chairs she saw in one section, and how people would move them apart for a bit of solitude, or push a few…

June 2020 Security Releases Node.js

May 26th, 2020

SummaryThe Node.js project will release security updates to all supported release lines on or shortly after Tuesday, June 2nd, 2020.
The highest severity fix will be "High".
ImpactAll supported versions (10.x, 12.x, and 14.x) of Node.js are v…

Block Links: The Search for a Perfect Solution

May 25th, 2020

I was reading this article by Chris where he talks about block links — you know, like wrapping an entire card element inside an anchor — being a bad idea. It’s bad accessibility because of how it affects screen readers. And it’s bad UX because it prevents simple user tasks, like selecting text. But maybe…

How to Convert a Date String into a Human-Readable Format

May 25th, 2020

I’ll be the first to admit that I’m writing this article, in part, because it’s something I look up often and want to be able to find it next time. Formatting a date string that you get from an API in JavaScript can take many shapes — anything from loading all of Moment.js to have…

Let’s Make One of Those Fancy Scrolling Animations Used on Apple Product Pages

May 22nd, 2020

Apple is well-known for its sleek animations on their product pages. For example, as you scroll down the page products may slide into view, MacBooks fold open, and iPhones spin, all while showing off the hardware, demonstrating the software and telling interactive stories of how the products are used. Just check out this video of…

Avoid Heavy Babel Transformations by (Sometimes) Not Writing Modern JavaScript

May 20th, 2020

It’s hard to imagine writing production-ready JavaScript without a tool like Babel. It’s been an undisputed game-changer in making modern code accessible to a wide range of users. With this challenge largely out of the way, there’s not much holding us back from really leaning into the features that modern specifications have to offer. But…

Tackling Authentication With Vue Using RESTful APIs

May 18th, 2020

Authentication (logging in!) is a crucial part of many websites. Let’s look at how to go about it on a site using Vue, in the same way, it can be done with any custom back end. Vue can’t actually do authentication all by itself, —we’ll need another service for that, so we’ll be using another…