Category Archives: Elsewhere

How Web Content Can Affect Power Usage

The Webkit blog, on how to optimize your pages so that they don’t drain the battery of your visitors their devices: Users spend a large proportion of their online time on mobile devices, and a significant fraction of the rest is users on untethered laptop computers. For both, battery life is critical. In this post, …

Continue reading “How Web Content Can Affect Power Usage”

Read Post →

SessionBox – Log in with multiple accounts to any website

For some online services such as Twitter and Facebook I have more than one account. Be it accounts for my company, an alter ego, my children, etc. To easily switch between these accounts – without logging out, back in, and doing the 2FA dance – I rely on a Chrome Extension named SessionBox which allows …

Continue reading “SessionBox – Log in with multiple accounts to any website”

Read Post →

class-names – Conditionally join CSS class names together

One of the packages I’ve been using a lot is classnames, a simple JavaScript utility for conditionally joining classNames together. Recently I stumbled upon @sindresorhus/class-names, a likewise package whose usage is very similar. import classNames from '@sindresorhus/class-names'; // Think of these like props of your React component … const props = { type: 'success', small: …

Continue reading “class-names – Conditionally join CSS class names together”

Read Post →

react-use – Browser APIs as React Hooks

react-use is a collection of React Hooks that wrap many browser APIs and functions. Want to track the geolocation of a device? Use useGeolocation. Want to read the battery status? Use useBattery. Etc. import {useBattery} from 'react-use'; const Demo = () => { const batteryState = useBattery(); if (!batteryState.isSupported) { return ( <div> <strong>Battery sensor</strong>: …

Continue reading “react-use – Browser APIs as React Hooks”

Read Post →

React Navigation 5.0 alpha – Rethinking Navigation as a Component-first API

Just announced at React Native EU is an alpha release of React Navigation 5.0, a navigator for use with React Native. An exploration of a component-first API for React Navigation for building more dynamic navigation solutions. Should play well with static type system Navigation state should be contained in root component (helpful for stuff such …

Continue reading “React Navigation 5.0 alpha – Rethinking Navigation as a Component-first API”

Read Post →

Tinderin – Side by Side photos of LinkedIn & Tinder profile pictures of the same person.

Tinderin, by Dries Depoorter: Side by Side profile pictures of LinkedIn & Tinder of the same person. Series of 10 photo frames. Quite sure those are the “clean ones” … 🔥 Be sure to check out Dries his other work too. Installations such as Quickfix, a vending machine that sells followers and likes, are really …

Continue reading “Tinderin – Side by Side photos of LinkedIn & Tinder profile pictures of the same person.”

Read Post →

Take both Light and Dark Mode screenshots with Puppeteer

dark-mode-screenshot is a Puppeteer script to take screenshots of both the light and dark mode versions of a website. $ npx dark-mode-screenshot –url https://googlechromelabs.github.io/dark-mode-toggle/demo/index.html –output screenshot –fullPage Works in somewhat odd way first requiring the OS to have dark mode enabled (?), and then launch Chromium: Once with prefers-color-scheme disabled (using –disable-blink-features=MediaQueryPrefersColorScheme) Once with Dark …

Continue reading “Take both Light and Dark Mode screenshots with Puppeteer”

Read Post →

Google Cloud Platform Terraform Recipes

At work we’ve recently started to use Terraform to manage the cloud infrastructure of our clients. During my initial research on how to set up a Cloud SQL instance using Terraform, I stumbled upon the “Terraform Google Modules” organization (unaffiliated to Google). They provide several Terraform modules in order to easily create: A Kubernetes Engine …

Continue reading “Google Cloud Platform Terraform Recipes”

Read Post →