It's been a while from the moment I started to blog about JavaScript topics and despite me being MEAN developer; Heh-heh, actually I'm quite friendly. Anyway, despite the MEAN orientation of the blog, I haven't talked much about the "A", that is AngularJS. Well, today we are going to fix this and since it's the first blog of the month, we'll be talking about Batarang - debugging tool for AngularJS.
Why even bother? I use Chrome
Over the years a lot of developers have shifted to rely entirely on Chrome developer tools in terms of debugging front end applications. While Chrome indeed provides a superb build-in debugging functionality, it doesn't support specific aspects of modern frameworks like AngularJS and Ember. For instance it's not aware AngularJS scopes and models. Being a JavaScript application, one can of course debug AngularJS code as any other web application, however if you're not a stranger to Zen Coding, than productivity should be your top concern. Besides Zen's mumbo jumbo, as for me I would rather spend as much as possible time creating new features instead of being sucked into debugging bog.
Where do I start?
For starters you should download the Batarang extension from the it's Chrome Market page. The extension's page also provides an eight minutes youtube tutorial, which can be a good starting point for you.