Alephant::Preview

Provides an in-page preview of components during development

Build Status

Gem Version

Installation

Add this line to your application's Gemfile:

gem 'alephant-preview'

And then execute:

$ bundle

Or install it yourself as:

$ gem install alephant-preview

Usage

Provide a view in a folder:

└── components
    └── group_name
        ├── models
        │   └── foo.rb
        ├── fixtures
        │   └── foo.json
        └── templates
            └── foo.mustache

Data mappers

If you application uses data mappers and they make more than one call, use the following folder structure to provide a fixture for each call:

└── components
    └── group_name
        ├── models
        │   └── foo.rb
        ├── fixtures
        │   └── foo_1.json
        │   └── foo_2.json
        │   └── foo_3.json
        └── templates
            └── foo.mustache

alephant-preview

The included preview server allows you to see the html generated by your templates, both standalone and in the context of a page.

Standalone

/component/:id/?:fixture?

Full page preview

/preview/:group_name/:id/:region/?:fixture?

group_name is the sub_folder that contains your templates

id is the component/folder name

template is the mustache template file name

location_in_page should be something like (for example) page_head (specified within a preview.mustache file that the consuming application needs to create).

  • http://localhost:4567/preview/group_name/id/template/location_in_page

Updating preview

alephant-preview update

When viewing the component in the context of a page, you'll need to retrieve a mustache template to provide the page context.

When performing an update a regex is applied to replace the static hostnames in the retrieved html.

Environment Variables

STATIC_HOST_REGEX="static.(sandbox.dev|int|test|stage|live).yourapp(i)?.com\/"
PREVIEW_TEMPLATE_URL="http://yourapp.com/template"

Contributing

  1. Fork it ( http://github.com/BBC-News/alephant-preview/fork )
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request