FeedStitch and JSON

This post originally appeared on Pointless Corp.

Recently, we introduced FeedStitch, our quick and easy feed aggregator. As we mentioned previously, one of the objectives for FeedStitch was to make it easy for computers as well as humans to use. Towards that end, we chose JSON as one of the output options. In this post, I’ll show you how you can use FeedStitch’s JSON output to integrate a group into a web page.

In our HTML page, we include three JavaScript files. The first is a minified version of Douglas Crockford’s JSON parser, which we’ll use to parse our JSON from FeedStitch. This is a little bit safer than using JavaScript’s eval function, and not noticeably slower.

The second is a FeedStitch group, in JSON format, as evidenced by the .json extension. Notice that we’re adding two parameters: a variable, “feedstitch”, and a callback, “JSON.parse.” When you use these parameters, FeedStitch modifies its output to assign the JSON object to a variable, and then to call the callback function with that variable as an argument. This technique, sometimes called JSONP, allows you to simply include the FeedStitch script and have a JavaScript object automatically prepared with the contents of the group. In this case, we specified both a variable and a callback, but you can also specify only one of the two, or neither.

(This would be a good place to mention that this technique allows the remote site (in this case, FeedStitch) to theoretically inject any content into your web page. At FeedStitch, we are only interested in good, not evil, so we will never intentionally use this functionality to do evil things. But you should still proceed thus informed.)

The last JavaScript file does all the work of inserting the group content into the page. Using the standard DOM methods, we create a list and populate it with entries from our group. This is only one way to do it; for instance, you could also build a string containing your entries and insert it into a DOM object using the non-standard innerHTML property.

Since we didn’t write any CSS, this looks plain, but our group is there on the page.

This demonstration is pretty basic, but given that parsing the JSON produces a full-fledged JavaScript object, there are all kinds of possibilities, like widgets, desktop clients, or anything else. If JavaScript’s not your language of choice, JSON parsers are available for nearly every modern programming language. Give it a try and see what you can do with FeedStitch and JSON!