Fang Shuwei

Shuwei's Blog

Configure webpack 4 for css files

22 Mar 2020

Webpack is a static module bundler for modern JavaScript applications. Css is the essential part for the JS web app....

Express in action 读书笔记

22 Jun 2017

Just finish reading Express in Action. Some highlights here. Part 1: Intro 1. What is Express? Express is a relatively...

OAuth2 & Alexa account linking

02 May 2017

I am working on Alexa account linking recently. Alexa account linking is based on standard OAuth2. By linking Alexa with...

jQuery sortable with responsive UI and touch device support

26 Dec 2016

I need to build a image previewer as part of an web app which allows drag and drop for sorting....

Work around CSS styling for IE8

03 Dec 2016

Work around CSS styling for IE8 Frontend technology is booming today. However it’s not for IE8. As there is still...

NUS Master in Information System course review

26 Nov 2016

NUS Master in Information System course review 历时两年,经历了n个在学校刷project的夜晚,我的NUS master读书生涯终于要告一段落啦!总共分4学期完成10门课,特来做个course review 附个人评分(满分5颗星),以作纪念。 2014 - 2015 Sem2 第一学期我一口气选了3门IS的课,于是开启了一学期不停读论文写report模式,然后发现我真的不适合读文科! IS5110 SOFTWARE PROJECT MANAGEMENT...

Setup development environment on Windows 7 碎碎念

29 Jun 2016

Setup development environment on Windows 7 碎碎念 自从有了mac,我的windows本早已沦为游戏机。鉴于这次只带了windows小本回国,于是只好开始在windows电脑上配置开发环境。 Preparation: Upload wip code onto Github Tools: Cygwin64 SourceTree Lantern vpn (in...

Jasmine test for AngularJS nested callback

10 Sep 2014

今天写了一个function,里面涉及了两个callback,大概形式为 function callbackFunction() { ServiceA.callbackA(data1, function(result1){ //success function callback ServiceA.callbackA(data2, function(result2{ return [result1, result2]; }, function(error){ console.log(error); }); }, function(error){...

在Chart.js上显示自定义tooltip

13 Jul 2014

Chart.js允许通过HTML5的canvas进行图表绘制。这里我们希望绘制一个环形图,点击图上各segment时可以显示自定义的圆形tooltip。 Chart.js支持通过几个变量添加tooltip,它提供一个tooltipTemplate但是却不支持自定义tooltip的HTML!于是决定自行绘制tooltip手动添加上去。 绘制一个tooltip CSS: .ft{ background:#bbaabb; position:absolute; left:100px; top:150px; } .circle{ width:100px; height:100px; border-radius:50px; font-size:20px; color:#fff; line-height:100px; text-align:center; background:#aa9966} HTML:...