Skip to content

Latest commit

 

History

History
191 lines (137 loc) · 3.97 KB

README.md

File metadata and controls

191 lines (137 loc) · 3.97 KB
Raw

Website & app scaffolding

[Website & app scaffolding](# Website & app scaffolding) is boilerplate & tools for websites and web apps development.

Inspired by below boilerplate & tools.

Features

  • Ruby & Node version management (rbenv & ndenv)
  • Ruby gems version management (bundler)
  • Javascript package management (bower)
  • Built-in preview server with LiveReload (grunt)
  • Build automation (grunt)
  • HTML minify
  • CSS/JS unify & minify
  • Image Optimization
  • File revisioning all static files
  • Sass/Compass folder structure best practices (app/styles/sass/styleguide.md)
  • KSS styleguide template (http://htanjo.github.io/kss-node-template/)
  • Deployment to GitHub Pages

Source structure

+- app
|   +- images
|   |
|   +- styles
|   |   +- sass
|   |   |   +- modules
|   |   |   +- partials
|   |   |   +- vendor
|   |   |   +- styleguide.md
|   |   |   |
|   |   |   +- main.scss
|   |   +- main.css
|   |
|   +- styleguide
|   |
|   +- bower_components
|   +- scripts
|   |   +- vendor 
|   |   +- plugins
|   |   +- main.js
|   |
|   +- index.html 
|
+- dist
+- styleguide-template

Development environment

You first need to install Node.js and Ruby.

Install Ruby (by rbenv)

  1. Install rbenv (https://github.com/sstephenson/rbenv#installation)
  2. Install ruby-build (https://github.com/sstephenson/ruby-build#readme)
  3. Install ruby (version of described in .ruby-version)
$ rbenv install
$ rbenv rehash # Rehash

Install Bundler

Bundler is powerful gem management tool.

$ gem install bundler
$ rbenv rehash # Rehash

Install Node (by ndenv)

  1. Install ndenv (https://github.com/riywo/ndenv#install)
  2. Install node-build (https://github.com/riywo/node-build#install)
  3. Install node (version of described in .node-version)
$ ndenv install
$ ndenv rehash # Rehash

Ruby gems / Node modules / Bower packages

Install ruby gems

Install ruby gems described in Gemfile.

$ bundler install

Install local node modules

Install node modules described in package.json.

$ npm install

Install global node modules

Grunt CLI
$ npm install -g grunt-cli
$ ndenv rehash # Rehash
Bower
npm install -g bower
$ ndenv rehash # Rehash

Install bower packages

Install bower packages described in bower.json.

$ bower install

Grunt tasks

Serve

Launch preview server with LiveReload.

$ grunt serve

Build

Build for front-end source code.

$ grunt build

Launch preview server for build version.

$ grunt serve:dist

Styleguide

Generate styleguide. (app/styleguide)

$ grunt shell:styleguide

Deploy

Deploying to Github Pages.

User or organization site

CAUTION: User or organization site using master branch for Github Page. Change the default branch to develop (or whatever).

  • GitHub.com -> http://{user-name(or organization-name)}.github.io/
  • GitHub Enterprise -> http://{github-domain}/pages/{user-name(or organization-name)}/{user-name(or organization-name)}/
$ git push origin :master # if push rejected
$ git subtree push --prefix dist origin master

Project site

  • GitHub.com -> http://{user-name}.github.io/{repository-name}/
  • GitHub Enterprise -> http://{github-domain}/pages/{user-name}/{repository-name}/
$ git push origin :gh-pages # if push rejected
$ git subtree push --prefix dist origin gh-pages