Blog

25 October, 2011

Thoughts on Design

It's been so long since I've posted anything on the blog. My schedule has been packed with graduating from ITP, starting work as an interactive developer at the New York Times, and working at ITP as a resident researcher.

I thought I'd post these slides from a workshop I gave today about how to think about design in digital media. I'm hoping to expand them into a series of tutorials (hopefully on my re-designed website after Christmas), but until now this will have to do.

You can download the slides as a PDF here.

11 April, 2011

Codeconf Visualizations

Screenshots from 2 data visualizations I installed in the lobby at Github's Codeconf last weekend.

06 March, 2011

Why beginners should choose Ruby

I've rarely been as excited about anything related to web development as when making the switch to Ruby a couple of years ago. But it was when my fellow student from ITP, Greg Borenstein introduced me to Sinatra that I first noticed how perfect an environment Ruby is for web dev beginners.

In this post I will try to illustrate why I think Ruby and Sinatra should be the preferred environment for students who have never programmed before - and why it beats PHP any time.

The Ruby syntax

One of the strongest things about Ruby is the language syntax. In Ruby there are no messy variable symbols ($), no semi-colons (;), and the use of curly brackets ({}) and parenthesis () is often optional. This means shorter, readable code. The language structure in Ruby is as close to a written language structure as possible.

In the following few examples I'll try to compare the readability between Ruby and PHP. First is an example of creating an associative array in both languages:

	// PHP
	$my_objects = array('foo' => 'bar');

	# Ruby
	my_objects = {'foo' => 'bar'}

view raw associative.rb hosted with ❤ by GitHub

The last evaluated value in a Ruby function is always used as the return value. Notice the optional parenthesis in the Ruby function call.

	// PHP
	function something($foo)
	{
	$foo = "bar";
	return $foo
	}

	something("foo");

	# Ruby
	def something(foo)
	foo = "bar"
	end

	something "foo"

view raw functions.rb hosted with ❤ by GitHub

One of the most important things about Ruby is that it's a pure object oriented language, which means that everything is an object (including numbers and string literals). Take the following code that outputs "Hello" 10 times, using the 'times' function of the Number class. Is that not the most read-able for-loop you have ever seen?

	10.times do
	puts "Hello"
	end

view raw loop.rb hosted with ❤ by GitHub

There is a clean and defined place for every Ruby function, and this makes the life of the beginner much easier. The exact opposite is true for PHP, where you have to search through odd global functions to perform standard routines. As an example, in PHP you use sizeof() to count the size of an array, but strlen() to count the size of a string. In Ruby it's a different story:

	// PHP
	$array_size = sizeof([1, 2, 3]);
	$string_size = strlen("This is my string");

	# Ruby
	array_size = [1, 2, 3].size
	string_size = "This is my string".size

view raw array_size.rb hosted with ❤ by GitHub

This leads me to another important fact about Ruby: It's so well structured that your guess if often enough to find the correct function call of an object. I love this next one. Ruby functions that return boolean values have a question mark at the end:

	// PHP
	if(empty(my_array))
	{
	my_array[0] = "Hello";
	}

	#Ruby
	if my_array.empty?
	my_array[0] = "Hello"
	end

view raw emptyarray.rb hosted with ❤ by GitHub

Class properties and symbols You remember all that time you've spent scrolling up and down in your PHP classes to define or edit class properties and constants, because they need to be defined at the top of the class, but used from within your functions? Ruby gets rid of all this by allowing class properties (using @) and constants (called symbols, using :) to be declared on the fly. The following code examples both do the same thing: create an associative array as a class property and use a constant as a key and a string as a value. PHP uses 10 lines of code to do this. Ruby uses 5. Which example do you think is the easiest to understand for a beginner?

	// PHP
	class MyClass
	{
	const foo = 'foo';
	$bar = array();

	function __construct()
	{
	$bar = {self::foo => 'bar'};
	}
	}

	# Ruby
	class MyClass
	def initialize
	@bar = {:foo => 'bar'}
	end
	end

view raw classes.rb hosted with ❤ by GitHub

The Ruby Gem system

One of the areas where PHP really fails is with libraries. Even though people have been using PHP for many years, I've never seen a student use a PHP library in my life. This is a problem with the language framework: To use a PHP library you have to download it, unzip it, copy it to your server root and include it in your script. Kind of a hassle. But what happens when the library gets updated? Then you have to do it all over again.

One of the most powerful things about Ruby is the Gem system. It's a small program that comes with Ruby that can download, update or delete Ruby libraries from a central repository. You can also create your own online repository if you want to. Because Ruby has a central place for all libraries this means that the beginner has easy access to well-documented and well-maintained Ruby libraries (called gems).

One of these gems is the Bundler gem, which helps you automatically install the gems you need for your project. Create a simple file in your project folder that lists all the gems your project needs. Run a single command in terminal, "bundle install" , and all your gems will install on the machine. Imagine how easy it is to update libraries in a project: update the Gemfile and run the command again. Deploying to a server that has no Ruby gems installed? No problem. Run "bundle install" after uploading your project files and you're ready to go.

	# Bundler file syntax
	source 'http://rubygems.org'
	gem 'rails', '3.0.4'
	gem 'mysql2'

view raw bundler.rb hosted with ❤ by GitHub

Ruby Gem makes the life of a beginner so much easier, as they almost never have to build complicated functionality by themselves. If someone has done it before, it's probably accessible as a gem. Want to build a Twitter application that saves all of your tweets as PDF's? No problem. Using the Prawn and Twitter gem this is possible with only 10 lines of code.

Databases and ORM's

I have not written a single line of SQL code since I started developing in Ruby. This is because there are tons of gems that take care of the database calls for you, the so-called Object Relational Mappers. All programmers know the problem: you work and think in object oriented patterns, but still you need to write SQL calls to fill your models. This is not so much a problem when you have single model to fill, but what if your project demands class associations (my blog post has many comments), or even polymorphic associations (my blog post has many comments. Comments can have nested comments)? There is simply no way a beginner can wrap his head around this easily.

ORM's exist as a layer between the code and the database, providing excellent abstraction for the beginner. In other words, it allows you to stay in the object-oriented world. As an example, let's look at how you would create a blog using Datamapper, a perfect ORM fit for your Sinatra application. First you define your models and then run the command "auto_migrate!" to create the tables in your database.

	class Post

	include DataMapper::Resource

	property :id, Serial
	property :title, String
	property :body, Text
	property :created_at, DateTime

	has n, :comments

	end

	class Comment

	include DataMapper::Resource

	property :id, Serial
	property :name, String
	property :body, Text

	belongs_to :post

	end

	DataMapper.auto_migrate!

view raw datamapper.rb hosted with ❤ by GitHub

Then you can save data from Ruby to the database. Notice how my_post.comments.create automatically creates and saves a comment belonging to my_post:

	my_post = Post.create( :title => 'My First Post',
	:body => 'This is what I have to say',
	:created_at => Time.now)

	my_comment = my_post.comments.create( :name => 'Rune Madsen',
	:body => 'I like this post')

view raw create.rb hosted with ❤ by GitHub

And you can show the data on your website. Notice how all the comments automatically gets build in the comments array of the Post objects:

	for post in Post.all
	puts post.title
	puts post.body

	for comment in post.comments
	puts comment.name
	puts comment.body
	end
	end

view raw loop.rb hosted with ❤ by GitHub

And that's basically it. Using ORM's the beginner don't have to worry about SQL calls, as DataMapper will take care of all the querying.

IRB

Ruby comes with an interactive console, which allows you to type code and get the results immediately. For the beginner this can be an excellent way of testing code without having to worry about creating Ruby files or classes. The interactive console is opened by typing "irb" into a terminal window:

	$ irb
	$ > Time.now
	$ => Sat Mar 12 13:22:13 -0500 2011
	$ > 3.times do puts "Hello" end
	$ Hello
	$ Hello
	$ Hello
	$ => 3

view raw irb.sh hosted with ❤ by GitHub

Sinatra

Sinatra is a micro-framework perfectly suited for a beginner. You can write a Sinatra application in one single file or use view files to separate code and formatting. In Sinatra you write a function for every route in your website, also specifying the type of HTTP request. This is an excellent approach for newcomers, as it learns the beginner the basic concepts of HTTP requests and routes. The following is a simple Sinatra application specifying 3 routes available for GET requests. Notice the last route. It allows visitors to visit e.g. /greeting/rune, and Sinatra automatically parses the value of :yourname into an associative array and makes it available in the function.

	require 'sinatra'

	get '/' do
	"Welcome to my frontpage"
	end

	get '/about' do
	"Welcome to my about page"
	end

	get '/greeting/:yourname' do
	"Hello #{params[:yourname]}. Welcome to my website "
	end

view raw sinatra.rb hosted with ❤ by GitHub

Another great thing about Sinatra is how easy it is to separate the controller code from the view. This is standard practice for any web project, and with Sinatra it is as easy as creating a 'views' folder, create the views, and render them with one line of code. All class properties will be available in the rendered view, as shown in this simple greeting application:

	# index.rb
	require 'sinatra'

	get '/:yourname' do
	@name = params[:yourname]
	@time = Time.now
	erb :greeting
	end

	# views/greeting.erb
	<h1>Hello <%= @name %></h1>
	The time is now <%= @time %>

view raw routes.rb hosted with ❤ by GitHub

With Sinatra it's ridiculously easy to build your own API, using the GET, POST, PUT, DELETE functions. This example is taken directly from the Sinatra Book:

	get '/dogs' do
	# get a listing of all the dogs
	end

	get '/dog/:id' do
	# just get one dog, you might find him like this:
	@dog = Dog.get(params[:id])
	# using the params convention, you specified in your route
	end

	post '/dog' do
	# create a new dog listing
	end

	put '/dog/:id' do
	# HTTP PUT request method to update an existing dog
	end

	delete '/dog/:id' do
	# HTTP DELETE request method to remove a dog who's been sold!
	end

view raw sinatra_datamatter.rb hosted with ❤ by GitHub

Heroku

No programming language is worth anything without easy deployment, and this is where PHP has been successful. With PHP you can upload your files to a server via FTP and the site is online immediately. However this approach quickly becomes a problem when working with bigger projects. Either you choose to edit your PHP-files on your local computer and upload them to the server manually via your FTP client, or you choose to edit the files directly on the server. I've seen students doing both things, and in the end it's a frustrating way of working. If you edit your files on your local computer, you have no idea what files you actually changed, and you often have to upload the entire project again. This is not a great approach if you're building your site using Drupal that ships with +8000 files. Editing the files directly on the server is not a better alternative, as your local copy gets out of sync, and the live site will crash if you make any coding mistakes.

(http://www.heroku.com">Heroku is a rock-solid Ruby platform that provides free hosting for your Ruby site. Heroku ships with a heroku gem, which allows you to create a domain and deploy your files from your local computer. The following commands will install the Heroku gem and create your personal web space on http://rune.heroku.com:

	$ sudo gem install heroku
	$ heroku create rune

view raw deply.sh hosted with ❤ by GitHub

Heroku integrates with the version control system Git, which means that you can upload your code using one simple command. This command will only upload your changes since last push, and you will never find yourself looking for updated files in your FTP client ever again.

$ git push heroku master

view raw push.sh hosted with ❤ by GitHub

Using Heroku does require the beginner to learn the basic concepts of Git. This can be challenging for a beginner who has never used the command line before. Fortunately there is a number of great GUI's like Git Tower that provides a clean interface for the beginner. However I'm a big supporter of learning basic command line usage to beginners. Git can basically be operated using very few commands:

	# Create a git repo in the current folder
	$ git init

	# Add all files to the repo
	$ git add .

	# Commit the files to the local repo with a message
	$ git commit -m 'Added my files'

	# push to Heroku
	$ git push heroku master

view raw git.sh hosted with ❤ by GitHub

Conclusion

I feel strongly about Sinatra as the perfect tool for teaching web development, especially in places where non-programmers need to learn to sketch out prototypes fast. On top of that, students who learn Sinatra can jump to Rails when building larger-scale applications. Almost everything about the Ruby/Sinatra combination seems like a perfect match for the web dev beginner: The Ruby syntax, excellent documentation, clear separation of code and views, great ORM's and an easy and understandable introduction to HTTP requests through the Sinatra API. On top of that comes easy deployment with Heroku.

Just like the professional web development firms have moved away from PHP, I think it's time for educational institutions to take the same approach. The reasons for using Ruby instead of PHP are simply too many.

Much of this is directly inspired by discussions with Greg Borenstein around the use of Ruby and Sinatra at ITP.

28 February, 2011

Write Me

Times are super busy right now, so I'll just want to post this image of the latest project I did with Amy and Christine from ITP. It's a video sculpture programmed in Open Frameworks where people can leave a drawing using a tablet, and the sculpture plays back the drawings from the collective pool of all past visitors. As soon as my schedule clears I'll do a bigger write up in the portfolio section of this site.

26 February, 2011

Thesis Essay

I'm currently defining my thesis project, and this is a short essay illustrating some of the key points of my thesis idea.

Thesis Essay - Google Doc

Newer Posts Older Posts