Webpack is a packaging tool whose purpose is to pack all static resources. Some people will ask why is webpack needed? Webpack is the cornerstone of modern front-end technology. Conventional development methods such as jQuery, HTML, and CSS static web page development have fallen behind. Now is the era of MVVM and data-driven interfaces. Webpack packs all kinds of new and useful technologies in modern JavaScript development.

Trying to describe webpack can be overwhelming, so I won’t waste everyone’s time. Understand this picture to know the ecosystem of webpack:

1. Loader Lists

raw-loader: Load the original content of the file (UTF-8)
file-loader: output the…


1. Regular Expression

If you are a developer, you must know this to save your time.

2. Codelf

Still, struggling with the name of your variable’s name? This is what you look for to save tons of your time.

3. Sprites Generator

For those people who have difficulty to combine many png/jpg as sprites.

4. .gitignore Generator

Picking your own programming language and generate your customized gitignore file.

5. CodeSandbox Editor Online

Helping users to edit their code online which they don’t need to install any IDE on their desktop.

6. UI-Gradients

Simple Gradient example to speed up your development

7. FreeCodeCamp

Using freeCodeCamp you can learn more than you thought.

8. EggHead

To learn all the front end framework and…


Vue 3 is officially live and most people want to try out the new feature. If you are also itchy to play around with it. Here I create a simple app for you to try on and understand better.

The image below is when developers shifting from Vue 2 to Vue 3 is rapidly increased from Google Trend and the red line indicating the Vue 3 and the blue line is what Vue 2 user actively participate.


1. NGINX

Nginx (pronounced “engine-x”) is an open source reverse proxy server for HTTP, HTTPS, SMTP, POP3, and IMAP protocols, as well as a load balancer, HTTP cache, and a web server (origin server). The nginx project started with a strong focus on high concurrency, high performance and low memory usage. It is licensed under the 2-clause BSD-like license and it runs on Linux, BSD variants, Mac OS X, Solaris, AIX, HP-UX, as well as on other *nix flavors. It also has a proof of concept port for Microsoft Windows.

docker run --name nginx -v /some/content:/usr/share/nginx/html:ro -d nginx


The great news of the Cloud Provides an always free cloud instance recently. Now I had been played around and enjoyed the feeling of using Oracle Cloud service. They always come with some great features and free 30 days trial if you don't like it.

If you want to learn about how to set up a new Oracle instance, you can reference my last article.

It steps you through everything you need for docker and docker-compose of setting up the docker and installs all the basic requirements. …


Tampermoney was created by Jan Biniok. He was initially working on that in May 2010, and it emerged from a Greasemonkey user script that wrapped to work as a Chrome extension. Since there is much reusable code, he providers more compatibility than Chrome’s native script support. And yet, it becomes a very successful pattern for many developers to learn and explore.


We have heard the word “data binding” more often in the programming. The key to “data binding” is to monitor the changes of data, but for such an object: let obj = {value: 1}, how should we know that obj had Changed?

1. defineProperty

ES5 provides the Object.defineProperty method, which can define a new property on an object, or modify an existing property of an object, and return the object.

obj: an object
prop: attributes of the object
descriptor: the description of the permission of the object
let obj = {}
Object.defineProperty(obj, "money", {
value : 100, // Updated value…


As many developers know, Npm was acquired by Microsoft, a popular JavaScript-developer platform, that it is planning to integrate with the GitHub platform. In the future, which ecosystem will be acquired by Microsoft possibly?

Microsoft officials said npm currently supports more than 1.3 million packages and 75 billion downloads a month. Microsoft intends to always keep the npm registry available as open-source and free to developers, said GitHub CEO Nat Friedman.

“For the millions of developers who use the public npm registry every day, npm will always be available and always be free,” Friedman wrote.

In the future, the company…


For most users in with macintosh operation system, they know about homebrew. However, there is a very handy tool call MacPorts as a software engineer or developer.

With the Port command, you can install most of the useful packages by entering the command sudo port install packagename in the Terminal. By using port command, it analyzes the packages if it exists on your system and it is much faster. One of the best thing that for MacPorts, it simplifies the installation of software on macOS and Darwin operation System. Installed packages can be updated with the command sudo port ugrade…

Jay Chow

Full Stack Developer — Typescript | Javascript | NodeJS | Python |MongoDB | ReactJS | VueJS | EmberJS — Blog writer & Professional writer❤️ @ shijiezhou.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store