Skip to content

Instantly share code, notes, and snippets.

View ruanyl's full-sized avatar

Yulong Ruan ruanyl

  • Amazon Web Service
View GitHub Profile
@seeliang
seeliang / lint-only-changed-files.MD
Last active April 10, 2024 09:44
How to lint only changed files?

find out the differences

use git diff to generate file list

git diff --name-only master

limited to certain file types

add ext filter

@jayphelps
jayphelps / package.json
Last active March 20, 2024 09:41
TypeScript output es2015, esm (ES Modules), CJS, UMD, UMD + Min + Gzip. Assumes you install typescript (tsc), rollup, uglifyjs either globally or included as devDependencies
{
"scripts": {
"build": "npm run build:es2015 && npm run build:esm && npm run build:cjs && npm run build:umd && npm run build:umd:min",
"build:es2015": "tsc --module es2015 --target es2015 --outDir dist/es2015",
"build:esm": "tsc --module es2015 --target es5 --outDir dist/esm",
"build:cjs": "tsc --module commonjs --target es5 --outDir dist/cjs",
"build:umd": "rollup dist/esm/index.js --format umd --name YourLibrary --sourceMap --output dist/umd/yourlibrary.js",
"build:umd:min": "cd dist/umd && uglifyjs --compress --mangle --source-map --screw-ie8 --comments --o yourlibrary.min.js -- yourlibrary.js && gzip yourlibrary.min.js -c > yourlibrary.min.js.gz",
}
}
@mdo
mdo / 00-intro.md
Last active March 24, 2024 08:04
Instructions for how to affix an Ikea Gerton table top to the Ikea Bekant sit-stand desk frame.

Ikea Bekant standing desk with Gerton table top

@gaearon
gaearon / index.js
Last active January 5, 2022 18:45
Breaking out of Redux paradigm to isolate apps
import React, { Component } from 'react'
import Subapp from './subapp/Root'
class BigApp extends Component {
render() {
return (
<div>
<Subapp />
<Subapp />
<Subapp />
@vasanthk
vasanthk / System Design.md
Last active April 26, 2024 18:05
System Design Cheatsheet

System Design Cheatsheet

Picking the right architecture = Picking the right battles + Managing trade-offs

Basic Steps

  1. Clarify and agree on the scope of the system
  • User cases (description of sequences of events that, taken together, lead to a system doing something useful)
    • Who is going to use it?
    • How are they going to use it?

@kangax's ES6 quiz, explained

@kangax created a new interesting quiz, this time devoted to ES6 (aka ES2015). I found this quiz very interesting and quite hard (made myself 3 mistakes on first pass).

Here we go with the explanations:

Question 1:
(function(x, f = () =&gt; x) {
@paulirish
paulirish / what-forces-layout.md
Last active April 26, 2024 17:33
What forces layout/reflow. The comprehensive list.

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
@praphull27
praphull27 / Jenkins_Protractor_Headless_Chrome_Setup_Ubuntu_14.04.md
Last active April 9, 2024 11:44
Jenkins, Protractor and Headless Chrome Browser Setup on Ubuntu 14.04

Jenkins, Protractor and Headless Chrome Browser Setup on Ubuntu 14.04

Update Ubuntu

sudo apt-get update
sudo apt-get upgrade

Install Java

@sebmarkbage
sebmarkbage / Enhance.js
Last active January 31, 2024 18:33
Higher-order Components
import { Component } from "React";
export var Enhance = ComposedComponent => class extends Component {
constructor() {
this.state = { data: null };
}
componentDidMount() {
this.setState({ data: 'Hello' });
}
render() {
@iest
iest / BzIframe.js
Created January 7, 2015 16:43
Basic react iframe with onLoad handler
'use strict';
var React = require('react');
var BzIframe = React.createClass({
propTypes: {
src: React.PropTypes.string.isRequired,
onLoad: React.PropTypes.func
},