Getting started with using ES6 / ECMAScript 6

December 18, 2014 – 3:36 pm Tags:

When you want to use ES6 you’re faced with a list of questions: Transpilers, shims, browser support…

In this article, I’ll give you a detailed guide on making sure you get started with ES6 the right way, and instructions on how you can set up a workflow for using ES6 in production easily.

Read the rest of this entry »

How to make your code self-documenting?

December 1, 2014 – 5:55 pm

Isn’t it fun to find a comment in code that’s completely out of place and useless? What if you could write fewer comments and still keep the code easy to understand?

One of the primary ways to do this is making your code-self documenting. When code is self-documenting, it doesn’t need comments to explain what it does or its purpose, which is great for making the code easier to maintain. As a bonus, with fewer comments, it’s less likely they’ll be crap!

In this article, I will show you several ways you can make your code document itself.

Read the rest of this entry »

AngularJS best practices: Be careful when using ng-repeat’s $index

November 10, 2014 – 12:54 pm Tags: ,

“A customer reported they deleted an item and the wrong item got deleted!”

Sounds like a pretty serious bug. This is what we got one time at work. Attempting to locate it was quite difficult, because naturally the customer had no idea what they did to reproduce the issue.

Turns out the bug was caused by using $index in an ng-repeat. Let’s take a look at how this happens, and a super simple way to avoid this type of bug entirely, and also a few lessons we can learn from this.

Read the rest of this entry »

What do the top 1% of software engineers do that the other 99% do not?

October 20, 2014 – 3:12 pm

This interesting question was recently posed on Quora: What do the top engineers do, that the rest do not? And how do you get the habits to become one?

Anyone can tell you something like “oh you should use source control!”, or “you should comment your code!” or other obvious things like that.

But there is a limit to how much code and how good code you can crank out daily, so how do you actually become better?

Read the rest of this entry »

Using techniques from statically typed languages in JavaScript

September 2, 2014 – 8:48 pm

I wrote an article discussing some techniques from statically typed languages. Head over to SitePoint to check it out!

Here’s what you can expect:

  • JavaScript type system, and how it tries to bite you
  • Expanding more about the rule of consistent types with more details on using it to reduce bugs
  • Dealing with type-checking and type-conversion in a way that doesn’t result in spaghetti and extra checks all over the code

Head over to SitePoint to read the article

In order to become a better developer, you must first become a teacher

August 18, 2014 – 1:20 pm

The headline might sound pretentious, but what is the most important skill for a developer besides actually writing code? Communication.

What do you typically do when you communicate as a developer with someone else?

You explain problems, you describe solutions, you talk to non-programmers about what you’re doing. You could also say that you’re teaching others about what you’re doing. Heck, when you’re writing code, you need to comment it and that is also a form of teaching – teaching someone what your thought process was when writing this code.

Being a good communicator is often completely overlooked. Sure, you might see a job placement ad wants someone who has “good communication skills”, but what does that even mean?

Let’s take a step back and think about why it’s really important for a developer to be a good communicator, and then we can come back to how you can become a better developer by teaching – but don’t worry, this process will only require a small amount of effort, although if you enjoy it, you can absolutely spend more time on it too, and reap bigger rewards!

Read the rest of this entry »

How to reduce bugs in JavaScript code by following the rule of consistent types

August 11, 2014 – 6:22 pm Tags:

One of the most annoying type of bug in JavaScript code is when the code doesn’t have logical types. Oh hey, I’ll just sum these two numbers… NOPE! They’re actually strings! That just makes me so angry. To make matters worse, this is something I’ve had to deal with a lot with a codebase I’ve been working with recently.

JavaScript is dynamically typed, and it doesn’t care what you do with its variables. You can have a variable contain a boolean, then put an array into it… then put a number into it… but this does not mean you should.

Your values should have one type only

Sometimes you see code like this

function getNames(person) {
  if(person.firstName == '') {
    return false;
  }
 
  return [person.firstName, person.lastName];
}

At a glance, it doesn’t look like there’s anything wrong with it. However, it breaks a very important rule you should follow to keep typing-related bugs away from your code.

In a language with static typing, the above would not work. The problem is that the function has inconsistent return types. What this means is the function can return both a bool value, and an array value. That kind of thing would never fly in a statically typed language, and there’s a very good reason why you should never do this in a dynamically typed language either.

Inconsistent types will give you a headache

When a function returns different types, you can’t make any kind of assumptions about its output. As a result, it will cause a mess, both in code and possibly in bugs as well.

Let’s say you take the above function and want to combine the names…

var result = getNames(person);
var combined = result.join(' ');

Now what will happen when the function takes the first path and returns a bool? A “true” or “false” value does not have a function join in them, therefore it will cause the code to throw an error. In order to deal with the possibility of a bool instead of an array, we have to add all this useless fluff into the code

var result = getNames(person);
var combined = '';
if(typeof result != 'boolean') {
  combined = result.join(' ');
}

Now, the example above is very simple. If you have ever worked on a large JavaScript codebase that broke this rule, you already know how bad it will get in a real application.

Always be mindful of your types

In order to fix this problem, we can simply rewrite the function like so

function getNames(person) {
  if(person.firstName == '') {
    return [];
  }
 
  return [person.firstName, person.lastName];
}

By keeping the return type consistent, we reduce the likelihood of bugs being caused by incorrect types. We also reduce the amount of code that you need to write, and less code is always better than more code.

Working in dynamic languages like JavaScript gives you great freedom, but with great freedom comes great responsibility. Save yourself the headaches, and keep your types consistent!

Are you tired of having to deal with bad JS code?
Sign up for my newsletter and learn how to fix that

  • What's the best way to architect large scale JavaScript apps?
  • Automate common development tasks and save hours of your time
  • Refactoring that horrible mess into something more manageable
  • Etc.  

We will never sell your information or spam you, ever.

Hello World Open 2014 thoughts

June 19, 2014 – 2:26 pm Tags:

I participated in the coding world championships, or Hello World Open, 2014. The challenge was to write an artificial intelligence for a slot-car racing game.

I wrote my bot in Haskell, and managed to rank 11 out of 856 competitors in the first qualification round, and 78 out of 203 in the second qualification round.

Read on for some general thoughts and a bit of analysis on the algorithms my bot used.

Read the rest of this entry »

Book review: Dependency Injection with AngularJS

February 16, 2014 – 11:29 am Tags: , , ,

Are you in the market for a book on AngularJS? Here’s my review of the book Dependency Injection with AngularJS, written by Alex Knol and published by Packt Publishing.

Disclaimer: I was sent a free copy of the book for review purposes.

Read the rest of this entry »

Tips for taking screenshots with PhantomJS + CasperJS

February 5, 2014 – 7:38 pm Tags: ,

It’s quite easy to use PhantomJS to muck around with pages, especially if you use CasperJS which provides you a bit nicer API.

It’s also pretty easy to take screenshots, but there’s a few things you need to take into account if you want the results to be accurate…

Read the rest of this entry »