Skip to content

Instantly share code, notes, and snippets.

Yang Wei yang-wei

Block or report user

Report or block yang-wei

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
yang-wei /
Last active Jan 11, 2020
Elm Destructuring (or Pattern Matching) cheatsheet

Should be work with 0.18

Destructuring(or pattern matching) is a way used to extract data from a data structure(tuple, list, record) that mirros the construction. Compare to other languages, Elm support much less destructuring but let's see what it got !


myTuple = ("A", "B", "C")
myNestedTuple = ("A", "B", "C", ("X", "Y", "Z"))
yang-wei / fullscreen.css
Last active Dec 16, 2019
Full size background image using CSS cover in mobile devices
View fullscreen.css
html {
background: url(image url) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
height: 100%;
overflow: hidden;
yang-wei /
Created Oct 28, 2015
How to use switch PHP(using phpbrew) version in nginx config
php -v
PHP 5.6.3 (cli) (built: Oct 28 2015 09:47:41)
Copyright (c) 1997-2014 The PHP Group
Zend Engine v2.6.0, Copyright (c) 1998-2014 Zend Technologies

But this only changes in CLI. You have to tweak you nginx(same for apache) to make it works. Nginx will still using the native PHP-FPM.

> ps aux | grep php-fpm
yang-wei /
Last active Sep 24, 2019
Elm Json.Decode tutorial and cheatsheet

When receiving JSON data from other resources(server API etc), we need Json.Decode to convert the JSON values into Elm values. This gist let you quickly learn how to do that.

I like to follow working example code so this is how the boilerplate will look like:

import Graphics.Element exposing (Element, show)
import Task exposing (Task, andThen)
import Json.Decode exposing (Decoder, int, string, object3, (:=))

import Http
yang-wei /
Last active Sep 19, 2019
ES6 destructing (and rest parameter)

We will first discussed how destructing and rest parameters can be used in ES6 - in arrays and objects. Then we will look at a few examples and also discuss some quiz.


var array = [1, 2, 3, 4];
var nestedArray = [1, 2, 3, 4, [7, 8, 9]];

var [a, b, c, d] = array;
console.log(a, b, c, d)
yang-wei /
Last active Jun 8, 2019
Clojure Thread-first vs Thread-last Macros

Repost from:

In this post, I am going to show you {when|how} to use Clojure marcos, ->> aka thread-last and -> aka thread-first. In some case, -> and ->> may perform the same operation if you do not pay enough attention. So I will also show you what's the difference between them. Note that doc -> and docs ->> din't make sense for me at first, so if same thing happened to you I hope that this post will make it clear.

If I am coding a function in Clojure, I would not think to write in macro firstly(maybe I am still new to it?). Macros like -> and ->> only come in my mind when it comes to refactoring. They are not neccessary in our program but they will make it elegant.

To explain how both of these macros work, let's us solve a quiz together.

[Write a function which calculates factorials.](

yang-wei / keyValuePairs.elm
Last active May 1, 2019
Json.Decode example
View keyValuePairs.elm
import Graphics.Element exposing (Element, show)
import Task exposing (Task, andThen)
import Json.Decode exposing (Decoder, int, string, object3, (:=), at, keyValuePairs)
import Http
type alias Languages =
List (String, Int)
mailbox =
yang-wei /
Last active Apr 30, 2019
Vue.js tips and tricks

Notes: All the examples below are only tested on Vue.js 1.0 (above).

Notes: The examples below use ES6 so it's recommended to use browserify or webpack to easily integrate babel.

when or where can we use this.$el

When you need to access DOM attribute, be careful with the lifecycle. Vue.js has a few useful lifecycle hooks.

Let's say we want to scroll our component to the bottom (imagine it's a long list with overflow-y: auto) once it's instantiate.

yang-wei / BarChart.jsx
Created Aug 7, 2016
react d3 (v4.0) stacked bar chart using rd3
View BarChart.jsx
'use strict';
import { scaleOrdinal, schemeCategory20c } from 'd3-scale';
import React from 'react';
module.exports = React.createClass({
displayName: 'BarChart',
propTypes: {
yang-wei /
Last active Aug 8, 2018
PHP extension ext-memcached * is missing from your system
➜  admin git:(master) phpbrew --version
phpbrew - 1.23.1
cliframework core: 2.5.4
➜  admin git:(master) php -v
PHP 5.6.30 (cli) (built: Aug  7 2018 17:48:36)
Copyright (c) 1997-2016 The PHP Group
Zend Engine v2.6.0, Copyright (c) 1998-2016 Zend Technologies
➜  admin git:(master) which php
You can’t perform that action at this time.