ganapativs

• Install iTerm2 from https://www.iterm2.com/
• Install oh-my-zsh from https://ohmyz.sh/ or https://github.com/robbyrussell/oh-my-zsh
• Set iTerm2 theme tab theme to Dark - Preferences | Appearance | Tabs | Theme > Dark
• Install Fira Code fonts from https://github.com/tonsky/FiraCode (Clone and navigate to dstr > ttf, install all font files by double clicking)
• Install Powerline fonts from https://github.com/powerline/fonts
• Set fonts for iTerm2 - Preferences | Profiles | Text
  • Change Font to 14pt Fira code regular and Check Use Ligatures checkbox
  • Change Non ASCII Font to 14pt Fira mono and Check Use Ligatures checkbox
• Install iTerm2 snazzy theme from https://github.com/sindresorhus/iterm2-snazzy
  • Navigate to Preferences | Profiles | Color Presets > Snazzy

ceejbot

ESM modules in node: npm edition

The proposal you’re about to read is not just a proposal. We have a working implementation of almost everything we discussed here. We encourage you to checkout and build our branch: our fork, with the relevant branch selected. Building and using the implementation will give you a better understanding of what using it as a developer is like.

Our implementation ended up differing from the proposal on some minor points. As our last action item before making a PR, we’re writing documentation on what we did. While I loathe pointing to tests in lieu of documentation, they will be helpful until we complete writing docs: the unit tests.

This repo also contains a bundled version of npm that has a new command, asset. You can read the documentation for and goals of that comma

simenbrekken

import { Component, createElement } from 'react'
import { graphql as withGraphQL } from 'react-apollo'

class GraphQL extends Component {
  constructor(props, context) {
    super(props, context)

    this.client = props.client || context.client
    this.renderer = this.createRenderer(this.props)
  }

thedaviddias

  <link rel="preload" href="css/global.min.css" as="style" onload="this.rel='stylesheet'">
  <noscript><link rel="stylesheet" href="css/global.min.css"></noscript>
  
  <script>
    /*! loadCSS. [c]2017 Filament Group, Inc. MIT License */
    !function(a){"use strict";var b=function(b,c,d){function j(a){if(e.body)return a();setTimeout(function(){j(a)})}function l(){f.addEventListener&&f.removeEventListener("load",l),f.media=d||"all"}var g,e=a.document,f=e.createElement("link");if(c)g=c;else{var h=(e.body||e.getElementsByTagName("head")[0]).childNodes;g=h[h.length-1]}var i=e.styleSheets;f.rel="stylesheet",f.href=b,f.media="only x",j(function(){g.parentNode.insertBefore(f,c?g:g.nextSibling)});var k=function(a){for(var b=f.href,c=i.length;c--;)if(i[c].href===b)return a();setTimeout(function(){k(a)})};return f.addEventListener&&f.addEventListener("load",l),f.onloadcssdefined=k,k(l),f};"undefined"!=typeof exports?exports.loadCSS=b:a.loadCSS=b}("undefined"!=typeof global?global:this);
    /*! loadCSS rel=preload po

kitten

With styled-components into the future

Preprocessing is dead, long live preprocessing!

This is a CFP for ReactiveConf 2017's open call for Lightning talks. If you'd like to see this talk become a reality, please ⭐ star this gist. #ReactiveConf

ryanflorence

const markdownIt = require('markdown-it')
const frontMatter = require('front-matter')
const Prism = require('prismjs')

const aliases = {
  'js': 'jsx',
  'html': 'markup'
}

const highlight = (str, lang) => {

wuct

// Consider <Button /> is a pure render component
import { pure } from 'recompose';
const Button = pure(props =><button>{props.children}</button>);

const App = () => <div>
  Call me maybe?
  <Button><IconPhone /> Call</Button>
</div>

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

martnst

Editors

• Counterparts Lite (Mac App)
• POEditor (Web App)
• brightec Online XLIFF Editor (Web App)

resources

• http://www.lingualizer.net/tools/files/category-localization-tools.html
• http://www.brightec.co.uk/blog/free-online-xliff-editor

tomchentw

language: node_js
node_js:
- '0.10'
install: npm run dev_install
env:
  global:
    secure: CODECLIMATE_TOKEN