Convert jQuery ajax function into promise (in ES6)

If you happens to want to convert jQuery’s ajax function into promise style using ES6 promise. Here is an example for you:

utils.js

Then you can use ajaxPostPromise in this way:

app.js

That’s it!

You can apply the same principle in converting other callback-style library into promise!

p.s. If you are looking for native and promise way to call your API, you may also check out fetch.

Use Slack as notification service in your workflow

This article intend to give some pointers to developers new to Slack on how to integrate their services / workflow with it. You can add a message to Slack and get notified as simple as a command like this:

My Use case

So my main purpose of using Slack it to get notified with certain events happen and implement it with minimum effort. For example, Continue reading “Use Slack as notification service in your workflow”

10 common usage of lodash

lodash is a excellent tool library for every javascript developer. It is similar to underscore, but smaller. It is always come in handy to keep it in your toolchain.

map

This should be quite familiar for most JS developers. It iterate through a collection and perform a 1-to-1 mapping.

mapValues

mapValues is just like map but instead of the key being iterate Continue reading “10 common usage of lodash”

Make Docker work with iptables

Docker containers are just like a computer, the networking between host and containers is affected by the firewall. My iptables has a default DROP all policy, but it will make the Containers cannot communicate with the host. Here is the fix you’ll need. Continue reading “Make Docker work with iptables”

Docker named volume explained

Named volume is a new feature since Docker 1.9, it allows you to manage persistent data more easily, and also the volume can be provided by other storage drivers such as Glusterfs instead of “just a directory on the host”. This new feature is particularly useful in production environment. (On the Dev side, I think we still need mounted volume) Continue reading “Docker named volume explained”

Using Envoy to deploy website on the remote server

Envoy is a simple tool developed by the Laravel team. It is designed to perform task like deploying a website on a remote server, e.g. your VPS.

How does it work?

Continue reading “Using Envoy to deploy website on the remote server”

Customize your own version of Bootstrap

Bootstrap is a great starter framework, I use it almost everyday. However sometimes you want to customize it to your needs. While you can use the Customize tool on the official website which is very handy, but you may want to automate the build and integrate with your workflow, this is the tutorial for you. Continue reading “Customize your own version of Bootstrap”

Javascript simple floating and forever moving image

In this example, I will show you how to  animate an element and make it moving up and down infinitely. And I will do it without any explicit Loop construct (no for, while loops), with the help of the jQuery.

HTML:

Javascript

 How it works

In CSS, we set the element (the IMG) to absolute position so that it “float up” and detach from the normal layout. With this, we can move the image up and down by changing the “top” CSS property.

In Javascript, we define two functions, bannerMoveDown() and bannerMoveUp(). In each function, we use the jQuery animate() method to animate the IMG element, and after the each animation ends, we call the other one respectively, thus making it loop forever.

Finally, we call bannerMoveDown() to initiate the animation loop.

Fully functional example

Please checkout a fully function example here on JSFiddle: http://jsfiddle.net/madcoda/mN3n8/

Thanks for reading, Leave your comments down below if you encounter any problem!

AngularJS minimal MVC example

Recently started to learn AngularJS, which is really a very good framework. It makes routes, Two way data binding and modular design easy.

I have created a minimal MVC example for beginners to get started with. This is a BMI calulator.

You can also try the jsFiddle here.

Properly execute shell commands and return errors in PHP

Sometimes you want to run a command on your server through PHP. There are couple of ways to do it, system()exec()shell_exec(), passthru(). All of them pretty much works alright with some slight differences. I would like to share my method which I think is more “programmatic”. Continue reading “Properly execute shell commands and return errors in PHP”