A rather geeky/technical weblog, est. 2001, by Bramus
React Query provides you with a set of hooks to fetch data in React. Think of pages that use pagination, infinite scroll, auto-refetching, etc. It’s backend agnostic, so sources can be REST, GraphQL, etc. Here’s an example that uses pagination import React from 'react' import fetch from '../libs/fetch' import { usePaginatedQuery } from 'react-query' export …
Continue reading “React Query – Hooks for fetching, caching and updating asynchronous data in React”
Dave Rupert: I’ve always abided in the idea that “HTML is accessible by default and then we come along and mess it up. But that’s not always the case. There are some cases where even using plain ol’ HTML causes accessibility problems. I’m going to start rounding up those HTML shortfalls in this here post …
Now this is fun: Send a tweet to @bbcmicrobot with some BASIC code and it will run it on a 1980s 8-bit computer emulation for you, replying with the result (as a video) Deploy your BASIC code to our 6502 data center in just one tweet. Welcome to 8-bit cloud 10 MODE 2 20 COLOUR …
scroll-margin-top
If you’ve ever implemented a design with a fixed header, you’ve surely had this problem: You click a jump link like <a href="#header-3">Jump</a> which links to something like <h3 id="header-3">Header</h3>. That's totally fine, until you have a position: fixed; header at the top of the page obscuring the h3 you're trying to link to! Fixed …
By applying some math you can give an element that you’re dragging around a more natural feel … See the Pen Sigmoid-2 by Nash Vail (@nashvail) on CodePen. How to fix dragging animation in UI with simple math →
The Mandalorian’s set used some serious Danger Room/Holodeck stuff to pull off a virtual shot-on-location feel for its many different settings, and powering the world projected on its giant LED wall was none other than Epic Games’ Unreal Engine 4. The setup allowed the cast to shoot in multiple locations in a single day, to …
Continue reading “How Lucasfilm used Unreal Engine to make The Mandalorian”
Brent shares his Laravel knowledge in a series of blog posts: In this series, I’ll write about the knowledge we gained over the years in designing Laravel projects. I will take a close look at the Laravel way, and what did and didn’t work for us. This series is for you if you’re dealing with …
A small utility to demystify CSS selectors, explaining them in plain English. Best part of it all: it updates the URL upon entering a selector so you get directly shareable links 🙂 Selectors Explained →
<input type="number" />
The fine folks at GOV.UK: Until now, the GOV.UK Design System date input component used the HTML element <input type=”number” /> to provide a number keypad when a user enters dates. However, we recently moved away from <input type="number"> to <input type="text" inputmode="numeric" pattern="[0-9]*"> Why the GOV.UK Design System team changed the input type for …
Continue reading “Why you should probably avoid using <input type="number" />“
Nice demo by Adam Argyle to create a 4 Corner Gradient in CSS: Even though working with gradients has gotten some improvements, you’ll still need a trick to achieve this one: stack 2 simple linear gradients and use a linear mask to blend them together: mask-image: linear-gradient(to bottom, transparent, black);