addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

benjie

Long Live CoffeeScript and Long Live ES6

Clearly ES6 is a huge improvement over ES5, and tools like [6to5][] allow us to use these cool features now. I was reading [Replace CoffeeScript with ES6][replace coffeescript] by [Blake Williams][] and thought it was a great summary of how ES6 solves many of the same problems that CoffeeScript solves; however I'd like to comment on a few of Blake's points and talk about why I'll be sticking with CoffeeScript.

Classes

Classes in ES6 (like many of the syntax changes in ES6) are very similar to the CoffeeScript equivalent. To support browsers that are not fully ES5 compliant (e.g. IE8-), however, we still can't really use getters/setters, so ignoring these the comparison is:

vakrilov

function pageLoaded(args) {
    var page = args.object;
    
    if (page.android) {
        setGradientAndroid(page);
    }
    else if (page.ios) {
        setGradientIOS(page);
    }
}

addyosmani

#!/bin/bash 
# A simple script to backup an organization's GitHub repositories.

GHBU_BACKUP_DIR=${GHBU_BACKUP_DIR-"github-backups"}                  # where to place the backup files
GHBU_ORG=${GHBU_ORG-"<CHANGE-ME>"}                                   # the GitHub organization whose repos will be backed up
                                                                     # (if you're backing up a user's repos instead, this should be your GitHub username)
GHBU_UNAME=${GHBU_UNAME-"<CHANGE-ME>"}                               # the username of a GitHub account (to use with the GitHub API)
GHBU_PASSWD=${GHBU_PASSWD-"<CHANGE-ME>"}                             # the password for that account 
GHBU_GITHOST=${GHBU_GITHOST-"github.com"}                            # the GitHub hostname (see comments)
GHBU_PRUNE_OLD=${GHBU_PRUNE_OLD-true}                                # when `true`, old backups will be deleted

ohanhi

Learning FP the hard way: Experiences on the Elm language

by Ossi Hanhinen, @ohanhi

with the support of Futurice 💚.

Licensed under CC BY 4.0.

Editorial note

PurpleBooth

Project Title

One Paragraph of project description goes here

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.

Prerequisites

DarrenN

# Version key/value should be on his own line
PACKAGE_VERSION=$(cat package.json \
  | grep version \
  | head -1 \
  | awk -F: '{ print $2 }' \
  | sed 's/[",]//g')

echo $PACKAGE_VERSION

paulirish

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

emiloberg

DEMO 1

 <StackLayout orientation="vertical">
  <Button text="one"/>
  <Button text="two"/>
  <Button text="three"/>
  <Button text="four"/>
  <Button text="five"/>
</StackLayout>

vicapow

var x = [];
for (var i = 0; i < 56; i++) {
  x.push(new Uint8Array(1024 * 1024 * 1024));
}
console.log(x.length);