March 29, 2017

Cookie sync in programmatic advertising

Cookie is a browser mechanism to store small piece of information in client’s browser. Now days, cookie is widely used in: - Sign in. Store session in cookie for server side authentication. - User preference. It stores user preference and load them when open the site which makes the UI user friendly. - eCommerce. Remember the good in your shopping cart. - Tracking behavior. It records the user behavior for better targeting. ... Read more

March 9, 2017

yiin, free to wording

Yiin(隐) is an ancient Chinese life style which an individual tends to keep himself away from social life only focusing inside. I made this product because sometimes I just feel tired of registering and verification, password things when I want to say something. Saying to yourself or even nobody without asking for any comments or feedback should not have any barriers. It’s human nature that you are not asking for passport just for talking, you talk when you want to talk. ... Read more

December 21, 2016

Provision AWS Lightsail with Ansible

Amazon has announced a new cloud service Lightsail recently aiming at DigitalOcean, with exact same price and same spec of node. As a heavy DigitalOcean user, I am more than happy to try the alternative provided by AWS. Creating the first instance is not smooth, I got successfully created the first instance by AWS SDK after 3 weeks in and out mails with the support team. TL;DR This post is a quick guide on provisioning the instance by Ansible. ... Read more

November 18, 2016

Https for everything

HTTPS is highly recommended for every web site, as a web developer I am building both my personal and company app under https. Applying for the certificates could be a block for you to migrate/build your site to https as you need to pay for it and it could take quite a while. Thanks to letsencrypt now we can have free open certificate authorify for our sites. I will list the least steps to build a site by using certbot ... Read more

September 11, 2016

How to make ngrx/store work with HMR

In my previous post, I talked of a way to develop angular 2 app with HMR. The vendors I use are @angularclass/hmr and @angularclass/hmr-loader Later on, I thought I might need a data flow tool like redux to manage my app state and I found ngrx/store @angularclass/hmr injects some hmr prefix life cycles into the main module to let you to restore the data. But app state management is optional and you can choose your own way to implement it, so I will walk you through how I implement HMR with ngrx/store ... Read more

September 3, 2016

Angular2 HMR with backend server supported

Currenly I am developing a client + server side boilerplate with Angular 2 and Feathers. For server side, I am using ts-node with nodemon, so far so good. But I find it cumbesome that every time I need to bundle client side code. After some exploring, I find a way to solve the problem. These are the dependencies: angular2-hmr a bootload wrapper on bootstrapModule, it’s cleared classified how to use in github angular2-hmr-loader, a webpack loader to work with the previous one webpack-dev-middleware, just like webpack-dev-server webpack-hot-middleware, an express/feather middleware just like webpack-dev-server w/ hot All of their READMEs clearly walk you through, it just suprises me that few information could be connected on this while it’s a quite general practice in React

March 27, 2016

Vertical align an unknown size image

Some ways to vertiacl align an image in a div, the image’s width and height are unknown Use a helper incline-block div to vertica the image. The helper’s width is 0 Use a tricky way top, right, bottom, left all 0 and margin auto Use css transform translateY demo

June 17, 2015

Unit test Angular directive

I seldom test angular directive unless there is some DOM mutation being processed in the directive, like add/remove classes, show/hide elements or compile/destroy elements. If you have a heavy dependencies on directives, the unit test will be a little bit clunky as for mocking the inline controller of the required directive. Stack overflow gives several alternatives to do so, I am picking two of them which I prefer to go and demo them here. ... Read more

January 31, 2015

Scope, the most important thing in JavaScript

cope and scope chain, the most important mechanism in JavaScript, are barely clearly explained though specified in ECMA-262 version 5.1. Without scope mechanism, there wouldn’t be closure and functional programming. This post is aim to elaborate what happens behind from the very beginning when control enters the global code to execution end. Firstly, for easy literal, let’s agree on the following abbreviation: GE: Global Environment VE: Variable Environment LE: Lexical Environment OLE: Outer Lexcial Environment Reference ER: Environment Record EC: Execution Context go: global object (window for browser, global for NodeJS) ... Read more