See the Pen bmRXZG by Paul Lan (@lanshunfang) on CodePen.
Category: FRONT-END 前端
Bootcamp Windows 10 reverse mouse trackpad scroll – Macbook Windows 10 触摸板鼠标滚动方向修改
视频教程链接~Video Tutorial
Install Nginx latest build （1.15.4+) in Amazon EC2 (AMI Linux) , enable HTTP2/Server Push and TLS1.3 O-RTT – 安装 Nginx 最新版本到 EC2 上，并启用 HTTP2/Server Push 和 TLS1.3 O-RTT
Preface From Nginx v1.13.9, we gain HTTP2/Server Push eventually. And after nginx 1.15.4 it also support TLS1.3 0-RTT (early data) which support 0 roundtrip handshake…
迄今感觉最好的 Angular 5 在线编辑器&测试场 – Stupendous Angular 5 Online Editor & Playground
前言 —— Preface 是不是有时想整点小实验，又不想重新让 Angular Cli 编译整个项目？ Wanna do some experiement without resorting to AngularCli to recompile whole project? 来，小方今天给大家定制了这款碾压 Plnkr / JsFiddle / CodePen…
A simple example to generate reactive computed property in Angular 5 – 在 Angular 5 中使用计算属性
前言 – Preface 无论是 Vue.js 还是 Knockout.js， 计算属性 (Computed Property / Computed State / Calculated State) 都是一个有用的概念。在一般的情况下，尽可能地减少一个组件中的可变 （mutable）状态 （state），可能在一定程度上降低软件复杂度、代码量和风险性（变量不小心被更改）
Google Chrome Official Offline Installer for Chinese – update every 3-day – 谷歌浏览器官方离线安装包(中文版，每三天自动更新最新)
Chrome official release website has been blocked out in China. Provide the link for China netizens. 谷歌浏览器官方离线安装包。 https://lanshunfang.github.io/xiaofang.me/download/
How to setup Selenium Chrome Docker to use HTTP Proxy
As you may know, selenium docker is the main stream way to do a real GUI End-2-End headless testing over Chrome / Firefox. While it…
Protractor E2E Test for Non-Angular Website (jQuery-based)
GitHub: https://github.com/lanshunfang/protractor-jquery/ Videos YouTube YouKu (China) Why Google invented Protractor over WebDriverJs Protocol with crispy designs on real world testing scenarios. It’s originally for AngularJS and…
Install Internet Explorer / Microsoft Edge on your Mac – 正版免费的安装 IE Edge 和其他版本在你的 Mac 上
Preface – 前言 With reference to http://osxdaily.com/2011/09/04/internet-explorer-for-mac-ie7-ie8-ie-9-free/ 参考：osxdaily You are a regular developer who use Mac. You want to debug your website within IE。 你是一个正常的开发工程师，所以你用…
Everything are HTML components – 小谈 HTML 组件化与可视化的编程
从 AngularJS 1.0.7 开始，我们就拿它做项目。刚开始使用了 angular-seed 创建页面，结合 ng-controller 做了好多事。同时我们也用了 directive 做了些公用组件。 我们组在 retrospection 时，慢慢地有了对比。 ng-controller 做出来的东西都是大块大块的，彼此连动，组织很不清晰。而 directive 却是自成体系，透过组件嵌套和通信控制，我们可以做出任意的页面——而且还保证各个组件自己是独立、可测试和不受其他 Scope / EventListener 影响的。甚至，我们还总结出了一个原则：
A plnkr for you to get started with RequireJS + KnockoutJS + BootstrapCSS + jQuery, with KnockoutJS nested Component and CSS animation support
It’s pretty hard to work on KnockoutJS on a real world project with better folder organisation on Plunker. Here it is: With RequireJS / Bootstrap /…
WebStorm 卡得要死？来，充荤花挥你的 MacBook Pro 的内存吧 — WebStorm is unresponsive? Try this
For Mac Only 之前团队反映 WebStorm 卡，如今才发现是它的默认内存配置太弱。修改之： WebStorm is dying and being stuck on medium/big project. Try this change for your Mac. Bash: mkdir -p ~/Library/Preferences/WebStorm/ cp…