mxstbr

Enable tab completion for JSX with Emmet in Atom

This guide assumes you have the emmet and language-babel packages already installed in Atom

1. Open the keymap.cson file by clicking on Atom -> Keymap… in the menu bar
2. Add these lines of code to your keymap:

'atom-text-editor[data-grammar~="jsx"]:not([mini])':

itsmepetrov

// This example shows the difference
// between classNames, classNames/bind and classnames-loader


// submit-button.css
/*
:local .className {
  color: green;
  background: red;
}

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

felixexter

Flexbox

• Что такое Flexbox? Описание всех css свойств, основные принципы, преимущества и недостатки
• Полное руководство по Flexbox
• What is CSS Grid Layout?
• flexplorer

cvrebert

Test apparatus: http://jsfiddle.net/hRub4/

(Windows = Windows 8.1 desktop)

• Windows Chrome 39
  • Button focuses on click and via keyboard tabbing
  • Anchor focuses on click and via keyboard tabbing
• Windows Firefox 30.0
  • Button focuses on click and via keyboard tabbing
  • Anchor focuses on click and via keyboard tabbing
• Windows Internet Explorer 11

branneman

Better local require() paths for Node.js

Problem

When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

const Article = require('../../../../app/models/article');

Those suck for maintenance and they're ugly.

Possible solutions