Editor's Pick
Flying planes with JavaScript
We’re writing a web page that can control an autopilot running in JS that, in turn, controls a little virtual aeroplane. And by “little” I actually mean “most aeroplanes in Microsoft Flight Simulator 2020” because as it turns out, MSFS comes with an API that can be used to both query and set values ranging from anything as simple as cockpit lights to something as complex as spawning a fleet of aircraft and making them fly in formation while making their smoke pattern spell out the works of Chaucer in its original middle English.
CSS
text-box-trim-examples: text-box-trim examples and playground (previously known as leading-trim)
CSS Text Box Trim is a CSS property that allows you to remove the leading whitespace from a block of text. This is useful for removing the space between the top of the text and the top of the container.
text-box-trim is the new name for leading-trim.
text-box-trim is right now only supported by Safari Technology Preview with the old leading-trim name. But you can try it out right now in the playground.
Misconceptions about CSS Specificity
Whenever a post about Specificity in CSS – and by extension the Cascade itself – gets published I get very excited as it’s a core concept of the language that everyone should know. The more articles on this, the better!
However, I also sometimes raise one of my eyebrows as sometimes I, unfortunately, encounter something that’s just outright wrong.
To remove some of the confusion, here’s a list of misconceptions about Specificity in CSS.
JavaScript
Flying planes with JavaScript
We’re writing a web page that can control an autopilot running in JS that, in turn, controls a little virtual aeroplane. And by “little” I actually mean “most aeroplanes in Microsoft Flight Simulator 2020” because as it turns out, MSFS comes with an API that can be used to both query and set values ranging from anything as simple as cockpit lights to something as complex as spawning a fleet of aircraft and making them fly in formation while making their smoke pattern spell out the works of Chaucer in its original middle English.
React Spectrum Libraries
A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.
Object Structure in JavaScript Engines
From a developer's perspective, objects in JavaScript are quite flexible and understandable. We can add, remove, and modify object properties on our own. However, few people think about how objects are stored in memory and processed by JS engines. Can a developer's actions, directly or indirectly, impact performance and memory consumption? Let's try to delve into all of this in this article.
Uppy - Sleek, modular open source JavaScript file uploader
Uppy fetches files locally and from remote places like Dropbox or Instagram. With its seamless integration, reliability and ease of use, Uppy is truly your best friend in file uploading.
jQuery to javascript converter
Convert your jQuery scripts to efficient JavaScript directly in your browser. Receive reliable, chainable, modern JavaScript code instantly that can be used as a minimal utility library, while keeping your existing code untouched.
Building Your First Browser Game with Three.js and React: Part 1 - Getting Started
Are you ready to jump into the exciting world of 3D web games? In this series, we're going to build from scratch an interactive browser-based basketball game using Three.js and React Three Fiber. Imagine controlling a basketball with simple button clicks, aiming to score as many baskets as possible. If that sounds intriguing, you’re in for a treat!
By the end of this series, not only will you have a fully functional game, but you'll also have gained a good understanding of creating 3D experiences using Three.js and React. Check out the final version of the game to see what you'll be capable of creating. It's simple, fun, and a great way to dive into the possibilities of web-based game development.
The Forensics Of React Server Components (RSCs)
React Server Components (RSCs) combine the best of client-side rendering, and author Lazar Nikolov thoroughly examines how we got here with a deep look at the impact that RSCs have on the page load timeline.
UX
No, I don’t want to fill out your contact form
Contact forms are almost always worse for users than just putting an email on your website. I explore why they’re terrible, why you’ve done it anyway, and what to do about it.
Miscellaneous
Teranoptia - a typeface that allows you to imagine chimeric creatures
Teranoptia is a typeface without letters, a peculiar contraption that allows you to imagine chimeric creatures just by typing letters with your keyboard. Its design has been inspired by the Bayeux Tapestry and by medieval illustrations, as well as by children's books. You can use it to create border ornaments, to daydream about monsters or just to spice your layouts with marginalia.