6 visual regression testing tools for UI design

Responsive layouts are very difficult to test. It is more tedious to design and test all of a project’s screen elements at every breakpoint than it is to code them in the first place. Visual regression allows you to make visual comparisons between the baseline versions of the site and the version in development. The complete process is nothing but taking the screenshot of the original design and comparing it with the new, looking for pixel differences. Visual regression comes in various flavors, using a variety of technologies and workflows as mentioned below. Pick any one to suit your purpose.
(more…)

Read More

Book Review : Frontend Architecture for Design Systems

Being a backend developer my focus is usually on server side issues – languages, databases etc. However, as a web developer in general, a good knowledge of frontend design is also necessary as this enables one to work more effectively with the design and frontend development team. As for myself being a single freelance developer, I also need to be comfortable with frontend issues to work effectively with clients. Lately I have been focusing a disproportionate amount of time on server side programming and Internet of things, that I have somewhat lost touch with the changing landscape of frontend development. I needed to quickly update myself with the latest happenings in that area.
(more…)

Read More

JavaScript console tricks

It is generally easier to quickly experiment with PHP or some other language that has an IDE or REPL. However, it is often tricky to quickly test some new JavaScript code or library without first creating a plain HTML page and dropping down to the console.

Chrome developer console however makes it easier to test new libraries or even learn JavaScript if you are a newbie without using something like jsfiddle. Lets say you want to quickly test some jQuery features you like. Instead of creating a web page with the associated jQuery script tag, you can load jQuery from a CDN into the console directly.
(more…)

Read More

How to automatically backup MySQL database to Dropbox

Ever wanted to backup your MySQL database to Dropbox automatically. Well, there is a nice portable solution with Dropbox Uploader. Dropbox Uploader is a BASH script which can be used to upload, download, delete, list files, move, copy and much more from Dropbox. It’s written in the BASH scripting language and only needs cURL to work. I’ve tested it on my Windows/Cygwin environment at it works like a charm.
(more…)

Read More

Quick way to display CSV files as HTML tables

During database projects I frequently need to export certain views or intermediate results as CSV files. These are further used for importing into other databases. However, many times it is required to display the CSV files in web pages as HTML tables. As most times the data is generated on the fly it requires some JavaScript to turn the CSV data to HTML. One of my current favorite is the csv-to-html-table library. This allows you to easily integrate CSV files into your web pages.
(more…)

Read More

Creating Interactive Charts in AngularJS

Data in the form of rows and columns is boring, and it’s difficult to derive insights from it in that form. Add interactive charts to it, and you make it easier for everybody to make sense of it. You start seeing patterns that were impossible to spot by looking at raw data alone. But how do you add interactive charts to your website?

Well, that’s what this tutorial will teach you. In this post I will walk you through the process of creating interactive charts in one of the most popular JavaScript frameworks – AngularJS. We will be implementing charts via FusionCharts’ JavaScript charts package. And to make our job easier, we will make use of its AngularJS charts plugin.
(more…)

Read More