Tapestry - Pattern Library Maker

An app for creating and managing your front-end pattern library.

1. Create patterns in Markdown files
2. Browseable interface
3. Free and open source
4. Comment on each pattern using

   disqus

Built with Gulp, Angular and Markdown/YAML.

Dependencies

• NodeJS
• Bower
• Gulp

How to use

1. Clone the repository

   git clone https://github.com/PebbleRoad/tapestry.git
   

2. Install NPM and bower packages

   npm install && bower install
   

3. Launch the server

   gulp patterns
   

4. Open your browser and navigate to

   http://localhost:8000
   

Configuring disqus

Create a new discuss account and open

src/assets/js/app/app.js

disqus_shortname

Pattern format

---
name: Alert
description: |
    ### What
    Page­ level information or service alert. Critical updates with a defined time period should be pushed using the alert box.
    ### Use when
    For page­level critical updates.
---

    
This is a success alert
    
More body text
    

How it works

1. Patterns folder is watched by Gulp and JSON files are generated for each root pattern
2. AngularJS uses these JSON documents to show a browseable interface of the patterns
3. Inject your own CSS by editing

   index.html

   and add your own patterns

Todo

1. Unit testing gulp plugins - gulp-tree and gulp-script-inject
2. Unit testing of the Angular app