Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/zenizh/guard-template
Template for front-end development with Guard.
https://github.com/zenizh/guard-template
Last synced: about 1 month ago
JSON representation
Template for front-end development with Guard.
- Host: GitHub
- URL: https://github.com/zenizh/guard-template
- Owner: zenizh
- Created: 2014-05-27T05:26:47.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2014-05-30T07:14:28.000Z (over 10 years ago)
- Last Synced: 2024-04-16T00:49:58.192Z (8 months ago)
- Language: Ruby
- Homepage:
- Size: 156 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Guard Template
Haml/SCSS/CoffeeScriptを用いてフロントエンドを開発するためのテンプレートです。
Guardで各種ファイルを監視します。
モックアップの制作などに便利です。
## Structure
本テンプレートは以下のような構造となっています。
`/app`下のHaml/SCSS/CoffeeScriptを編集すると、`/public`下にHTML/CSS/JavaScriptが自動生成されます。
各種パス名を変更する場合は、`Guardfile`を編集してください。
```
/app
/haml # Haml配置ディレクトリ
index.haml
/scss # SCSS配置ディレクトリ
application.scss
/coffeescripts # CoffeeScript配置ディレクトリ
application.coffee
/public # HTML生成ディレクトリ
/images # 画像配置ディレクトリ
/javascripts # JavaScript生成ディレクトリ
application.js
/stylesheets # CSS生成ディレクトリ
application.css
index.html
/tools # シェルスクリプト配置ディレクトリ
Gemfile
Guardfile
README.md
```
## Installation
### 1. cloneする
```
$ git clone [email protected]:kami30k/guard-template.git [directory name]
$ cd [directory name]
```
### 2. bundleをインストールする
`tools/install.sh`を実行すると、`bundle install`を実行します。
本テンプレートでは`vendor/bundle`下にインストールしています。
なお、この実行には権限を与える必要があります。
```
$ chmod +x ./tools/install.sh
$ ./tools/install.sh
```
### 3. 監視する
`tools/watch.sh`を実行すると、`guard -w .`を実行します。
これも権限を与える必要があります。
```
$ chmod +x ./tools/watch.sh
$ ./tools/watch.sh
```
以降は、`tools/watch.sh`を実行するだけで監視することができます。
## Notes
一度`clone`すればローカルリポジトリは必要ありませんので、削除しても大丈夫です。
```
$ rm -rf .git
```