An instant web frontend dev tool


This project has been abandoned! Please head over to Yeoman !

Have you ever wanted your web page to be live-reloaded when you're at development? If so, you should try markab:

$ markab server [project]

It will start a web server host the project directory, watching for file changes and refresh your browser automatically.

$ [sudo] npm install markab -g

Using markab you can quick initialize a new project with you own template or the build-in markab-template:

$ markab create project -l /path/to/your/template
$ markab create project -t basic

Markab has LESS and Mustache support, so you can organize your code in a modular way. The only thing is to create a new directory named partial and put all your templates in there, and a new markab-data.json file for the template data if needed.

There's a typical structure for a new project

  - index.html
  - index.css
  - mixin/
      - settings.less
      - base.less
  - partial/
      - header.html
      - body.html

Inside the index.html and index.css they may look something like the following:

<!doctype html>
  {{> header }}
  {{> body }}
@import "mixin/settings" 
@import "mixin/base";

No need to include extra files in your page and pre-compile by your own. The markab server will handle all these for you.

$ markab build -o release 

This will combine and generate all files in the current directory into the release folder.

You may don't need mixin (partial is ignored by default) in the release, so you need to (i'm sorry) attach a .markab-ignore file inside the project. For instance:


After built the release folder it will look like this:

  - index.html
  - index.css
$ markab --help

Usage: index.js [options] [command]


  server [project]       start dev server
  create <project>       create new project
  build [project]        build the whole project to the target


  -h, --help                   output usage information
  -V, --version                output the version number
  -p, --port <port>            server port (defaults to 3000)
  -o, --output <output>        build destination
  -t, --template <name>        template name
  -d, --data <name>            data for for mustache template
  -l, --local-template <path>  local template path