romainl

Don't use Vim

Don't do the crime, if you can't do the time.

-- Anthony Vincenzo "Tony" Baretta

Vim is an amazing text editor. I love it. Really, I wouldn't [organize][organize] a Vim advent calendar if I didn't. But, as amazing as it is, Vim is not for everyone. It can't solve all your problems, or be a TUI version of your favorite IDE, or make you a better programmer, or land you that dream job in the Bay Area. But Vim can help you be more mindful, focused, and efficient, as long as you approach it with the right mindset.

Don't get me wrong, I certainly welcome you to try Vim, but I'm not a proselyte. I don't thrive on newbies. I just want you to use the right tool for the job and not waste your—and anyone's—time on a fruitless quest.

davidgilbertson

const fileHash = crypto.createHash('md5').update(fileContents).digest('hex');

ryanflorence

var $ = React.createElement

const App = (props) => (
  $('div', { className: 'app'},
    $('h1', null, 'Invoices'),
    $('ul', { className: 'list'},
      props.invoices.map((invoice) => (
        $(InvoiceListItem, invoice)
      ))
    )

mjackson

<div className="pricing" style={{ opacity: purchasing ? 0.25 : '' }}>
  {purchaseComplete ? (
    <div className="purchase-complete">
      <h2>Thanks!</h2>
      <p>
        Thank you for your purchase of {formatPrice(this.state.total)}.
        We’ll send you a receipt shortly.
      </p>
      <p>
        <button

Restuta

Below is the list of modern JS frameworks and almost frameworks – React, Vue, Angular, Ember and others.

All files were downloaded from https://cdnjs.com and named accordingly. Output from ls command is stripped out (irrelevant stuff)

As-is (minified)

$ ls -lhS
566K Jan 4 22:03 angular2.min.js

ohanhi

This is a proposal for a lightning talk at the Reactive 2015 conference.

NOTE: If you like this, star ⭐ the Gist - the amount of stars decides whether it makes the cut!

The Joy of Composition

Why stateless rendering is pure bliss

React just got stateless components, meaning that they are in essence pure functions for rendering. Pure functions make it dead simple - even fun - to refactor your views

iamnewton

$(function() {
  // good opportunity to combine into a single statement
  // qq w cw   <esc> A, <esc> 0 j q
  var a = 10;
  var b = 20;
  var c = 30;
  var d = 40;
  var e = 50;

  // opportunity to simplify syntax

yoshuawuyts

const sequence = require('run-sequence')

// create a middleware stack
// (obj, obj, [fn(obj, obj, fn)], fn) -> null
function mw (req, res, arr, done) {
  const fns = arr.map(fn => (next) => fn(req, res, next))
  sequence(fns, done)
}

MoOx

language: node_js

node_js:
- iojs

env:
  global:
  # https://docs.saucelabs.com/ci-integrations/travis-ci/
  # SAUCE_USERNAME
  - secure: Daa...

aldendaniels

React now supports the use of ES6 classes as an alternative to React.createClass().

React's concept of Mixins, however, doesn't have a corollary when using ES6 classes. This left the community without an established pattern for code that both handles cross-cutting concerns and requires access to Component Life Cycle Methods.

In this gist, @sebmarkbage proposed an alternative pattern to React mixins: decorate components with a wrapping "higher order" component that handles whatever lifecycle methods it needs to and then invokes the wrapped component in its render() method, passing through props.

While a viable solution, this has a few drawbacks:

1. There's no way for the child component to override functionality defined on the higher order component.