Change Font-Size within Input Field Based on Length

Recently I had a great conversation with an outstanding User Experience designer about a few interactions on a project we were working on. One of the points we talked about was, what should happen when text within input fields are excessively long. The desired result we both agreed on was to change the font size … Read more

Lazy Loading Images for Flexslider

Flexslider is one of the most used sliders, for good reason. This snippet helps lazy load your images. In order to create a perceived performance for users, we as authors shouldn’t allow the loading of every single image at once for sliders or carousels. In this snippet we only load the first and second image … Read more

Get URL with JavaScript

At some point in time you need to get the current URL and do some logic based on it. JavaScript has handy API called window.location which has all the information related to the windows current location. Running console.log(window.location); in the console or your JavaScript file will return the following Location object: Having a reference to … Read more

Scroll to position with jQuery

If you need to scroll to a specific location on the page this little custom jQuery function can help you out. This snippet will help you scroll to a particular section based on the element you choose. Add this little snippet inside your scripts file. Add this (also in your scripts file) and modify it … Read more

Adding Google Analytics to your React Application

Adding any kind of tracking to any project always seems to be an afterthought. Generally just before launching, a stakeholder puts their hand up and states that we need to track everything…. Usually resulting in lots of frustrating mutterings from all developers involved.

Integration and Comparison for ES6

If you’re still writing JavaScript using ES5 (also known as ECMAScript 5) and desire to author in ES6 (ES2015) fear not. We’ll look over some logical ways to start using this new syntactical sugar in your own work starting immediately. We’ll discuss and examine approaches to integrate features such as let and const plus compare var versus let and finally understand when to use the spread operator.

Don’t Load it till it’s Needed

One of the best ways to prevent page bloat is to treat everything as a resource that doesn’t need to be on the page until the user has to interact with it. The technique is called lazy-loading, and can be performed on almost any asset. It’s especially good for responsive websites, when the same content needs to be loaded across multiple devices, while still loading as quickly as possible. Let’s take a look at a few ways to make this possible.

Barebones ES6 project using Gulp

Dennis Gaebel previously discussed preparing for ES6, but in this post he take things one step further and examines an actual project using the tools he discussed in that article. He explains the steps required in order to setup a barebones ES6 project with the help of our faithful tooling companion Gulp.

Preparing for ECMAScript 6

ECMAScript 6 is the upcoming version of the ECMAScript standard and expects ratification some time around June 2015.

ES6 is a significant update to JavaScript, and the first update to the language since 2009. Implementation of these features in JavaScript engines is well underway as we speak. Let’s dive in and see what ES6 is all about.