Twitter: raymondcamden


Address: Lafayette, LA, USA

I wish I had linted before...

12-02-2013 3,254 views Development 12 Comments

My development process is probably not the same as most folks. As I do a lot of small POCs (proof of concepts) and demos I don't necessarily get that involved in larger projects or code bases. That's one reason I haven't been a big Grunt user yet. Something else that I've not really gotten into is linting. Linting is the process of checking your code for both existing and potential problems. In my mind though I always thought of linting as a best practices tool and while I want my code to be, well, the best, I don't typically worry about it so much when writing a little 20 line program to demonstrate something for a blog article. Heck, sometimes I'll even go out of my way to not do something that is best practice if I think it will get in the way of what I'm trying to explain in the demo/blog post. (As an example, when I teach jQuery I will avoid chaining 3+ calls together at once so as to keep things a bit simpler.)

But a few months ago I noticed something. Your linting tools are actually pretty darn good for pointing out problems. I know, obvious, right? But I didn't realize how often I'd do crap like renaming a function, telling myself I'd remember to update the references later, and then simply forget to do it. Here is a great example. I've got a call to a function I haven't written yet. The fact that my linter has it flagged as an error makes the tool work like a "live" TODO list.

I'm finding myself making much fewer mistakes now that I've started linting everything I write. Even on my small little demos I'm spending less time running into bugs in the browser and getting stuff working right earlier.

12 Comments

  • Commented on 12-03-2013 at 1:17 AM
    What tools are you using for linting? JSLint, i think. And should I lint html or css?
  • Salvatore fusto #
    Commented on 12-03-2013 at 2:06 AM
    Ray,
    i'm using Brackets and its lint tools, expecially for js and html, and surely agree with you but my question is that jslint is too verbose about position of key words, spaces among parenthesys, functions called before definition when defined in another file, and so on.
    what do you think about?
    regards
  • Bill Tudor #
    Commented on 12-03-2013 at 3:14 AM
    I just started using JSHint which is excellent for JS and JQuery code; was wondering if there is an equivalent for ColdFusion ?
  • Commented on 12-03-2013 at 5:50 AM
    @Plutov: I use JSHint. I found JSLint to be too strict. I use my own JSHint extension for Brackets. There are also linters for HTML and CSS and I use them as well, although I don't necessarily care as much.

    @Salvatore: Try JSHint. :)

    @Bill: Not that I'm aware of. In theory, one could be done as an extension to ColdFusion Builder.
  • Dan Fredericks #
    Commented on 12-03-2013 at 6:30 AM
    Any idea how a lint tool works and/or built? would it be a cool idea for someone to build an open source linting tool for ColdFusion, if it is possible? Maybe the team CF Advance could build something like this...or am i just thinking crazy?
  • Commented on 12-03-2013 at 7:00 AM
    @Dan: Take a look at JSHint - it is open source. :)
  • Andy K #
    Commented on 12-03-2013 at 4:00 PM
    @Bill/Dan - someone started one on Github but it looks like it's been forgotten about:

    https://github.com/russplaysguitar/navel
  • Salvatore fusto #
    Commented on 12-06-2013 at 4:00 AM
    Ray,
    i already use your JShint, but it is too verbose for warnings!
    also i noted some strange issue: this line, in angular
    myApp.controller ('myCtrl', ['$scope', '$http', function($scope, $http) {
    4) $http.jsonp('http://192.168.1.250:8500/remote/remoteCFC.cfc?met...')
    5) .error(function (data,status) { console.log(status)})
    6) .success(function(data) {$scope.person=data});
    ..............
    }]);
    generate errors:
    5 Missing semicolon. (W033)    .error(function (data,status) { console.log(status)})
    6   Missing semicolon. (W033)    .success(function(data) {$scope.person=data});
  • Commented on 12-06-2013 at 7:01 AM
    To be clear, JSHint isn't mine. I just wrote a Brackets extension for it.

    As for being verbose, don't forget you can configure what it complains about. Have you checked the JSHint docs? Look at my blog post yesterday on jQuery Mobile - the Quiz code I wrote shows an example of that.

    Missing semicolons is a problem... to JSHint. Again though you can tell it you don't care about that and it won't show it again. Please see the JSHint docs.
  • Commented on 12-06-2013 at 7:12 AM
    @Bill/Dan
    https://github.com/ryaneberly/CFLint

    Here's a CF Lint I put out on github recently. It supports both CFML/cfscript.

    @Ray - thanks for the name suggestion.
  • Commented on 12-06-2013 at 7:14 AM
    Ryan - you should consider building a CFB extension too.
  • Commented on 12-11-2013 at 7:32 AM
    Ray -
    Re: CFB extension: Agree that would be good. It gets the issue in front of the developer as soon as possible.

Post Reply

Please refrain from posting large blocks of code as a comment. Use Pastebin or Gists instead. Text wrapped in asterisks (*) will be bold and text wrapped in underscores (_) will be italicized.

Leave this field empty