CSS Grid Highlighter for Google Chrome

Firefox has been taking the lead into this one. Adem Ilter has created a basic version that works with Google Chrome.

CSS Grid Highlighter for Google Chrome →

Elsewhere , , , Leave a comment

Palestine Archipelago if it were in the ocean

The map above shows what Palestine’s West Bank would look like if all non-Palestinian land suddenly turned into water.

(via Brilliant Maps)

Elsewhere , Leave a comment

Fastlane Screencast: Integrate fastlane into your Ionic Framework build process

fastlane are an awesome bunch of tools. Josh Holtz has recently started Fastlane Screencast, a website with videos/tutorials for explaining and implementing built-in fastlane tools, fastlane actions, third-party fastlane plugins, continuous integration, and anything else that fastlane can possibly do.

The first video covers integrating fastlane into your Ionic Framework build process:

A second tutorial – covering dotenv and environment variables – is already up too 🙂

Fastlane Screencast →
Fastlane Screencast: Integrate fastlane into your Ionic Framework build process →

Elsewhere , , , , Leave a comment

When Twitter Refuses to Delete Abusive Tweets …

Shahak Shapira:

Over the last months, I reported about 300 hate tweets. Twitter failed to delete most of them, so I sprayed them in front of their office.

Nice guerilla action. Hopefully this will now get Twitter’s attention.

Sidenote: Dustin Curtis recently tweetranted (ranttweeted?) a few things Twitter could do to improve. Of course the topic hate speech / abuse was mentioned, as it is a problem:

Elsewhere , , Leave a comment

Basecamp Employee Handbook

For over 10 years, we didn’t have a handbook. In those 10 years, when a new person joined the company, they were expected to figure things out for themselves. But when we grew from a company of 10, 20, 30 employees to a company of over 50, our “introduction by immersion” style stopped working. New hires felt lost and isolated, and their first weeks or even months on the job were stressful because of it

Great stuff, especially the fact that it’s in the open. It might now be as mindblowing like Valve’s Handbook for new Employees, but it also gets the job done.

Take the section Titles for programmers for example. With this, every employee in the company has the same definition for – and can distinguish – junior/senior/lead/principal programmers, and are talking about the very same thing. It’s very important to name things, and to define what exactly they are. Otherwise they’ll lead to confusion, misunderstanding, and eventually a grudge or the like.

Basecamp Employee Handbook →

Elsewhere , , Leave a comment

Expo – Easily build apps with React Native

From time to time I’ve seen good things about Expo fly by on the Twitters, which piqued my interest:

Expo is a set of tools, libraries and services which let you build native iOS and Android apps by writing JavaScript.

Expo apps are React Native apps which contain the Expo SDK. The SDK is a native-and-JS library which provides access to the device’s system functionality (things like the camera, contacts, local storage, and other hardware). That means you don’t need to use Xcode or Android Studio, or write any native code, and it also makes your pure-JS project very portable because it can run in any native environment containing the Expo SDK.

Also comes with an online editor, named Expo Snack, that can run code immediately on your phone (after scanning a QR Code with the Expo App)

Expo – Easily build apps with React Native →
Expo Snack →

Elsewhere , , Leave a comment

Using Intersection Observers

With the Intersection Observer coming to Firefox, a nice article covering it appeared on Mozilla Hacks.

The IntersectionObserver interface of the Intersection Observer API provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document’s viewport.

To use it, create a new instance of IntersectionObserver, and then let it observe a given element (target):

let observer = new IntersectionObserver((entries, observer) => { /* … */});
observer.observe(target); // <-- Element to watch

Here's a demo pen:

See the Pen Hello IntersectionObserver by Dan Callahan (@callahad) on CodePen.

To not watch the target's relation to the viewport, but to another element, use the root option.

let observer = new IntersectionObserver((entries, observer) => { /* … */}, {
   root: parentElement,
});
observer.observe(target); // <-- Element to watch

Works in Edge 15, Chrome 51, and soon Firefox 55. For browsers that don't support it you can use a polyfill.

Intersection Observer comes to Firefox →
IntersectionObserver Polyfill →

Elsewhere , , Leave a comment

GridBugs – A Curated List of CSS Grid Interop Issues

Like Flexbugs, but then for CSS Grid Layout:

Inspired by Flexbugs this list aims to be a community curated list of CSS Grid Layout bugs, incomplete implementations and interop issues. Grid shipped into browsers in a highly interoperable state, however there are a few issues – let’s document any we find here.

By Rachel Andrew – who else?!of course.

GridBugs – A Curated List of CSS Grid Interop Issues →

Elsewhere , , , Leave a comment

Automatically rerun PHPUnit tests when source code changes with phpunit-watcher

Nice new package by Freek from Spatie.be. Think of it like Jest, but for PHP:

Wouldn’t it be great if your PHPUnit tests would be automatically rerun whenever you change some code? This package can do exactly that.

By default it will watch all files in the src, app and tests subdirectories in the directory where it is started.

Installation per Composer, of course:

composer global require spatie/phpunit-watcher

spatie/phpunit-watcher introductory blogpost →
spatie/phpunit-watcher (GitHub) →

Sidenote: If you’re new to PHPUnit, Sitepoint has got you covered with a newly released (re-)introduction to PHPUnit. Also, the folks over at CxSocial (former Engagor) have written a nice post on how to write better tests in PHPUnit

Elsewhere , , Leave a comment

Navigating on the next iPhone

Some folks have been poking around in the HomePod Firmware update. Doing so they’ve unearthed the existence of an upcoming face unlock feature using and infrared camera and face detection, the new iPhone’s bezel-less form factor, and its resolution of 1125 x 2436 (375 x 812 points rendered @3x).

Former Apple Software Engineer and now App Developer Allen Pike wonders how apps would render on this new iPhone, assuming the Home button being replaced with a virtual one (because it will disappear):

So, after ten years, the Home button is going virtual. Our beautiful new 812pt OLED display will have a function area carved out of the bottom, with Home in the middle. There are many things Apple could put on either side of the Home button – Android-like multitasking buttons I suppose – but iOS 11 gives us a giant clue.

Taking clues from the fact that the the navigation bar and the big bold titles in iOS11 are oddly positioned (see screenshot above) he suggests that the bottom 66pt of the new iPhone’s screen will be reserved for the virtual home button, and that the buttons of the navigation bar will move next to either side of it. This way the visual oddity is existent no more, and navigation is put within thumbs’ reach.

Developing for iPhone Pro →

Sidenote: If this were to be the case – which would make sense – I cannot help but wonder how Apple will tout this as their next great invention – which they tend to do – as Android phones have had their darn handy physical back button at said location for ages 😉

Elsewhere , , , Leave a comment