Provides an in-page preview of components during development
Add this line to your application's Gemfile:
gem 'alephant-preview'
And then execute:
$ bundle
Or install it yourself as:
$ gem install alephant-preview
Provide a view in a folder:
└── components
└── group_name
├── models
│ └── foo.rb
├── fixtures
│ └── foo.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"
- Fork it ( http://github.com//alephant-preview/fork )
- Create your feature branch (
git checkout -b my-new-feature
) - Commit your changes (
git commit -am 'Add some feature'
) - Push to the branch (
git push origin my-new-feature
) - Create new Pull Request