Start a dev server to preview your work without Yeoman

I published these notes on GitHub as a Gist recently, but I’ll go ahead and post them here too. It pertains to starting a dev server to preview your work quickly without using Yeoman. Yeoman is nice for doing this, especially using LiveReload, but you may need this and not always have the ability to use Yeoman or may not think it’s worth installing it just for that. Regardless, here’s how to preview your work on a dev server without Yeoman, using Ruby, Python or Node.js.

Requirements

Mac OS: Ruby and Python are pre-installed. Install Node.js.

Windows: First install Ruby, Python or Node.js

Ruby

Install the asdf gem.

gem install asdf

Change to the directory you want to host and type asdf from the terminal or command prompt.

Navigate to http://localhost:9292/ in your browser to preview your site.

Python

Change to the directory you want to host and type python -m SimpleHTTPServer 8080 from the terminal or command prompt.

Navigate to http://localhost:8080/ in your browser to preview your site.

Node.js

From the terminal or command prompt, type npm init and answer the questions from the prompts to create a package.json file.

Type npm install --save express to install express as a dependency and update your package.json file.

Create a JavaScript file called server.js and save it with the following contents.

var express = require('express'),
app = express();

app.use( express.static( __dirname + '/public' ) );

var server = app.listen(3000, function() {
console.log('Listening on port %d', server.address().port);
});

Put the files you wish to preview in a directory called public, and type node server.js from your parent directory.

Navigate to http://localhost:3000/ in your browser to preview your site.