The Tiny Javascript Lifestream

About

Contact

About

MicroStream is a tumblr-like blogging system that aggregates your content from across the web in
one convenient location. By using HTML 5's new window.history we can create a seamless browsing
experience from page to page while maintaining a well designed URL structure (instead of hash-tags).

For user agents that do not yet support window.history, we configure the web server to redirect
all requests to index.html so it can inspect the URL path on each request to load the correct resource.
This system has a routing system so you can create your own pages. Any request that does
not match a defined route will be shown the 404 page.

MicroStream also supports subfolder setup. So you can run your site in the site root or
in a sub directory without trouble. The routing system will add/remove the correct site path.

The contact page is an example using the Google Maps API to geocode addresses to instantly
show you users where you are in the world in relation to them.

Installation

This system uses the Yahoo! Pipes web API to aggregate all your RSS feeds into an easy to consume JSON response.

Step 1: Register/Login to Yahoo! Pipes

Click to create a new pipe and drag a "Fetch Feed" component onto the canvas.

Step 2: Add sites

Click the "+" (plus) icon next to the text "URL" to create additional input fields which you can use to add all your feed URL's.

Step 3: Order Results

Add a new "Sort" operator to the canvas and select "sort by pubDate, descending" to sort all the items in the order they were published. Make sure to drag a link between the "Fetch Feed" and "Sort" boxes.

Step 4: Save Pipe

Connect the "Sort" operator to the "Pipe Output" and click "Save" at the top of the screen.

Step 5: Get Pipe URL

Click "Get as JSON" on the pipe page to load the JSON view of the pipe. Then copy the URL in the address bar.

Step 6: Insert URL into blog

Open "index.html" and scroll down to the configuration line which asks for your yahoo pipe URL. Paste the URL and save the file!

Step 7: Enjoy!

Make sure to change any other links in the index.html file such as the links to your online profiles and friends! You also need to set your address so the map shows the correct location!