Created: 2012-03-20 16:42
Updated: 2018-11-17 00:10

What is this?

This is a simple HTML prototype written in HAML or ERB that is designed to be viewed with Serve.

What is Serve? Serve is an open-source rapid prototyping framework for Web applications. It makes it easy to prototype functionality without writing a single line of backend code.

How do I install and run Serve?

Serve is distributed as a Ruby gem to make it easy to get up and running. You must have Ruby installed in order to download and use Serve. The Ruby download page provides instructions for getting Ruby setup on different platforms:

After you have Ruby installed, open up the command prompt and type:

gem install serve

(OSX and Unix users may need to prefix the command with sudo.)

After Serve is installed, you can start it up in a given directory like this:


This will start Serve on port 4000. You can now view the prototype in your Web browser at this URL:


Compass and Sass

This prototype uses Compass and Sass to generate CSS. Both are distributed as Ruby gems and can be easily installed from the command prompt. Since the Compass gem depends on Sass, you can install them both with one command:

gem install compass

Learn more about Sass:

Learn more about Compass:

Rack and Passenger

Astute users may notice that this project is also a simple Rack application. This means that it is easy to deploy it on Passenger or in any other Rack-friendly environment. Rack it up with the rackup command. For more information about using Serve and Passenger see:


To export this project to pure HTML and CSS you will need the prerelease version of Serve. To get started with the prerelease version:

gem install --pre serve

To export your project, use the new "export" command:

serve export <project>:<output>

Where "project" is the path to the project and "output" is the path to the directory where you would like your HTML and CSS generated.

Making Changes and Deploying

  • Update files and thumbnails.
  • Verify it looks correct by running $ serve in the folder and looking locally.
  • $ git add [untracked files]
  • $ git commit -v -a
  • $ git push production master
Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more