There can be times when you want an asynchronous function or event to wait and finish within a loop. But at the same time, you cannot break or stop the…
Create GMaps editable polygons with toggle for Editable and Draggable | Vue.js
A few days ago, I showed how to create truly editable Google Maps polygons by updating the coordinates. In this tutorial, I'll show you how to toggle the edit options…
Create editable polygons in Google Maps JavaScript API in Vue.js | Example
Creating an editable and draggable polygon in Google Maps can be achieved after a bit of tweaking. The internet is flooded with multiple tutorials and articles on how to do…
How to change / manipulate an SVG fill color using Vue.js | Example
Vue.js has this amazing power to manipulate the attributes of an SVG file directly without any aid. While other flux-based frameworks often require support of external libraries, Vue doesn't. In…
Conditionally / dynamically bind multiple CSS classes in Vue.js | Example
One of the lessor known, yet powerful feature of Vue.js is dynamic binding of classes. Vue.js allows you to dynamically bind multiple CSS classes to a single HTML element. It…
How to generate a random unique file name in Vue.js | Example
There are millions of ways to generate a random name in a JavaScript application. The NPM library is loaded with tons of many such libraries. Most of these libraries are…
How to filter a list based on drop down selection in Vue.js | Example
Dealing with lists is something you cannot avoid no matter the kind of application you're building. With an ever growing list of records, you're often left to deal with filters…
Auto calculate total / price of cart items in Vue.js | Example
Working on an E-commerce app would definitely require you to sum up the card items at some point. While the logic to do that isn't rocket science, many of us…
Build an iOS / iPhone home screen clone in Vue.js
In this article, I'm going to demonstrate how I built an iOS home screen clone using just Vue.js. First, let's have a look at the project structure: Project files And…
