ささっとWebデザインというかコーディングをするのに便利かと思って『html5-scss-coffee-boilerplate』作って GitHub にアップしてみた

HTML と CSS + JS でコーディングするより、HTML + SCSS + CoffeeScript でやりたい

でも Grunt とか Yeoman とかインストールしたくない、と思ってたら丁度良く下記エントリー発見。

• 昨今の自分用Webアプリケーションひな形 - naoyaのはてなダイアリー
• 昨今のWebアプリケーションのひな形その2 - Grunt - naoyaのはてなダイアリー

自分がやりたいのはあくまでも HTML + SCSS + CoffeeScript でささっとなので極力シンプルにやりたい。
ということで...

html5-scss-coffee-boilerplate 作ってみた

前述のエントリーを参考にささっと作って GitHub に上げてみた。

• CortYuming/html5-scss-coffee-boilerplate · GitHub

構成

古いバージョンの jQuery と normalize.css を含めたのは、オフラインで作業・古いIE対応のため

html5-scss-coffee-boilerplate
├── Gemfile
├── Gemfile.lock
├── README.md
├── assets
│   ├── application.coffee
│   └── style.scss
├── public
│   ├── css
│   │   └── normalize.css
│   ├── index.html
│   └── js
│       └── jquery-1.9.1.min.js
└── server.rb

使い方

インストール

sinatra など

$ bundle install

サーバ起動

$ ruby searver.rb

• http://localhost:8888/

HTML, coffee, scss ファイルに書く。

• HTML
  • public/index.html
• SCSS, CoffeeScript
  • assets/application.coffee
• assets/style.scss

とりあえずこんな感じで。