Ramblings of a Tinkerer

I tinker. A lot. Mostly web development.

[clarkf-blog]

node on maverick

I just reformatted a computer I decided I'd use for some development, and I started thinking about how to best go about installing Node.JS. I installed Ubuntu Maverick (10.10), desktop edition. I have need for multiple node versions, and, as such, it wouldn't make sense to just install the nodejs package (which, at the time of writing, seems to only be at 0.3.8, just short of the latest stable release).

I've used both n and nave, and have come to prefer nave (it doesn't help that I prefer to stay close to the project; the maintainer of nave, Isaacs, works for Joyent and develops node). So I decided to get started.

Prerequisites:

First off, you'll need git! Run

apt-get install git-core

As root (sudo) to get git up and running. Now, for building you'll need a few packages: build-essentials (g++), libssl-dev and curl (for npm). Install them using apt-get, and then get ready to dig in:

Grabbing Nave

We'll need to grab nave from the github repo. Somewhere convenient, run:

git clone https://github.com/isaacs/nave.git

To clone nave into nave/. Now, within the nave directory, you have access to nave.sh, which will install node for you. As root, run:

sudo ./nave.sh usemain latest

(At the time of writing 0.4.1 was the latest version of node. usemain designates the specified version of node as your "main" version, see nave for details. You can see a list of available versions by running ./nave.sh ls-remote).

Now, go to the kitchen and grab a cup of coffee and maybe a sandwich. The build process on my machine (not great, but not horrible), took around 15 minutes.

Now you've got node! If we run:

$ node -v v0.4.1

Awesome! Now, we've got to get npm up and running. Isaacs has created a convenient installation script for installing npm:

curl http://npmjs.org/install.sh | sudo sh

Npm should install itself tidily (note that as of npm 0.3, npm runs safely as root, so don't worry about the sudo in there). Check to make sure that it works,

$ npm -v 0.3.9

Cool! We're almost there! We've got node and npm running, which means we're able to start developing, but we don't really have a good way of handling node versions. Well, we've got nave sitting right in front of us, so why not install it as a npm package:

sudo npm install

ought to do it. Note: at the time of writing, the github repo is a version behind the npm repo. If anything acts wacky (permission errors), just npm remove nave && npm install nave.

Now, if you type nave and hit tab (to autocomplete), you should see nave as well as nave@[version], proving that nave has installed as a node package:

$ nave Usage: nave [...]

Awesome! Now we're set up and running. You can use nave to control which versions of node you have on your system. I'd recommend getting 0.3.8, 0.2.6 and 0.4.x (latest) on your system for testing purposes. I might install them overnight, though (actually, I've noticed that older versions of node, particularly 0.2.x, compile significantly faster than 0.4.x). You can enter a subshell with a specified node version by running:

nave use [version]

and exit the subshell using exit, or just closing the terminal window to return to the "main" version of node. e.g.:

$ node -v v0.4.1 $ nave use 0.2.6 $ node -v v0.2.6 $ exit $ node -v v0.4.1

Hopefully this has helped somebody get a cool node development environment going. You can clean up by removing the cloned nave directory (now that you've got the package, it's redundant), and start coding!

[clarkf-blog]

A Few Things I've Been Working On

Hullo!

First off, I want to mention a few websites I've discovered (and rediscovered) recently that have really inspired me. Kodingen is definitely the bee's knees — it's a site that utilizes SkyWriter (aka Bespin) to allow developers a place and a platform to develop on. I've been considering getting a Netbook recently, and my major drawback is that there isn't a great text-editing webapp for development. Bespin is it (or, at least, the best we've got).

And github. Github is a fantastic place for developers to share their code, and a great repository for tracking changes, and keeping track of multiple versions of things. I opened my first github repository this afternoon, and I think I may now be in love.

I was working earlier this week on a ajax-powered HTML5 Blogging webapp, temporarily named "Blogit". Basically, it loads all of your posts from the server and displays them dynamically. It's rudimentary, and not a particularly useful project, but it's mostly for practice.

Which brings me to PageManager. It's something I hacked together this afternoon in a hurry before I had to run to work. It's basically a couple of classes that allow you to display multiple "Pages" (Sections? I'm still working on the nomenclature) within one HTML file. Kinda nifty, huh?

It's use is pretty simple. There are two classes: PageManager, and Page. Each Page has two methods:

var title = "Index"; var key = "index" var index = new Page(title, key); //.load() is required; it's first argument is always a callback that must be called. index.load = function(callback) { document.write("Hello, world!"); callback(); }; //.unload() is optional. Same deal with the callback. index.unload = function(callback) { document.body.innerHTML = ""; callback(); };

Pretty simple, huh? Now, key is a little tricky as well, it can be a string, as above, a RegExp object, or a function:

var view = new Page("View",/^view-(.*)/i); //Matches anything starting with "view-" var user = new Page("Profile", function (s) { //An anonymous function that shows the page when the string is either Superman or JohnDoe. if (s == "Superman" || s == "JohnDoe") { return true; } return false; });

//Set .load()s for view and user.

Now, we have to deal with the PageManager:

var pm = new PageManager(); pm.registerPage(index); //Registers index with the manager pm.registerPage(view); //And again... pm.registerPage(user); //...and again pm.setDefault(index); //Sets index as our default (main) page.

And finally, we have to make it all work:

window.onhashchange = function () { //Set the browser's hashchange event to be handled by our PageManager. pm.directTraffic(location.hash.substring(1)); } window.onhashchange(); //Calls the hash change event initially. Gets things rolling.

And that's about it. Other notable functions include:

pm.setUniversalLoad(function () { //Code here is executed before each .load() event. }); pm.setUniversalUnload(function () { //Code here is executed before each .unload() event. }); pm.setTitle("My Great Website!");

And that's about it. It's not fully featured yet, and I understand that it's got some inconsistencies, but I'm pretty happy with it. Comments? Concerns? Criticisms? COMMENT!

[clarkf-blog]

iPhone notification mockup.

Wouldn't it be nice?