Rewind

Origin

I started this blog a little over two weeks ago after getting stuck for an hour on a really simple Ember.js task which didn't require any knowledge that I hadn't already used successfully (or so I thought).  This was after a month of hard learning and developing!

So I threw up my hands and decided to start back at the beginning with a simple "Hello World" Ember app and explicitly test all of my assumptions about Ember setup, initialization, and various basic concepts.  And if I was going to do all that work, I might as well document it.  Thus was this blog born.

Ember.js Debugging 3 — JavaScript

Photo by Nathan Smith

I already covered the console object, which is built-in to the browser and is essential for debugging your Ember apps. Today I'll review features useful for debugging in JavaScript itself.

Ember.js Tools & Resources 4 — jsFiddle

You've hopefully heard of Gist (gist.github.com), the service that lets you dump some code into a box, hit save, and get a URL that you can share with others — without even logging in. (It has more cool features, but I couldn't find docs or a tutorial to link to...)

Well, jsFiddle is like Gist on steroids. Not only can you dump code and get a shareable URL, you can execute the code, play with it, and save new versions as you go. You can even give them names and collect them under your user account (if you're logged in) for your future convenience and others' benefit. Lastly, others can easily fork your fiddle in order to modify and re-share it.

It's an essential tool for experimenting with client-side code (which is what we'll be using it for in this blog), as well as hosting client-side miniapps to share with others when reporting bugs or asking for help. There are three panes for your HTML, CSS, and JavaScript, and a fourth pane that shows the results of executing your code — essentially, a mini-browser.

Here's what it looks like: