node package manager
Loosely couple your services. Use Orgs to version and reuse your code. Create a free org »

coffeekraken-carpenter

Coffeekraken Carpenter

Carpenter

Powerful tool that provide a nice web interface to display your website styleguide and modules/plugins documentations in one place.

Carpenter is like a architect plan for your website

Carpenter screenshot

Demo : Coffeekraken website carpenter

Features

  1. Build styleguide directly from your CSS codebase
    • Reflect perfectly what your website looks like
    • List all features that your CSS cover
    • Interactive demo
  2. Aggregate markdown documentations
    • Tell Carpenter where to look for markdown files, it take care of displaying them nicely
    • Aggregate all the useful documentations in one interface

Install

npm install coffeekraken-carpenter --save-dev

Configure

The configuration is made through the carpenter.config.js file that you need to add at the root of your project. Here's a simple example:

module.exports = {
    title : 'My Cool Website',
    styleguide : {
        files : [
            'dist/css/styleguide.css'
        ]
    },
    documentation : {
        files : [
            'node_modules/coffeekraken-s-*/**/*.md',
            'README.md'
        ]
    }
}
Check out the full config file reference here

Write some styleguide docblocks

In your styleguide.css file, you need to document your styleguide like so:

/**
 * @name  My Cool Component
 * @styleguide  Components / My Cool Component
 * @example  html
 * <div class="my-cool-component">
 *  Hello world
 * </div>
 */

Launch

In order to launch Carpenter in your project, you just need to add this line in your package.json scripts:

{
    "scripts": {
        "carpenter": "coffeekraken-carpenter"
    }
}

Then launch Carpenter with

npm run carpenter

Browser support

IE / Edge
IE / Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
IE11+ last 2 versions last 2 versions last 2 versions

As browsers are automatically updated, we will keep as reference the last two versions of each but this component can work on older ones as well.

Documentation

  • Configuration : All the configuration properties available
  • Node API : Describe all the exposed Node API methods
  • CLI : CLI options reference
  • Displays : How to display your docblocks into the web interface

License

The code is available under the MIT license.