easy-html-generator

This gem is a powerful and easy to use web development tool that helps developing modern web sites by generating static html pages. It uses:

CoffeScript aka Javascript
Sass aka css
Haml aka html
ActionView for ruby haml templating comfort

It can utilizes:

Bootstrap for responsive and modern html layouts
HeadJS for performance optimized resource loading
Bower for javascript dependency management
Grunt for javascript based task management
Google Anlaytics tracking of pageclicks
minimizing from coffee-, javascript-, sass-, css-, png- and image-files

It is developed with:

Ruby as implementation language
Rspec for testing
RuboCop for code quality

It is based on:

EasyHtmlCreator which was the fundament Dennis van de Hoef and me developed on.

Basic concepts

setup

Create a new project folder

mkdir my_project
cd my_project

Create a ruby 'Gemfile'

touch Gemfile

Paste this into the 'Gemfile'

source 'https://rubygems.org'

gem 'easy_html_generator'

Run in terminal

bundle install
ehg --init
ehg --create my_project

Now you should see the following folder sructure

Now run ehg --server

...and go to http://localhost:9292

After a sort time of generating you should see a directory listening in your browser.

Usage terminal

Usage: ehg [options]
    -s, --server [HOST_AND_PORT]     start the rack server, default: 0.0.0.0:9292
    -g, --generate [PROJECT]         generate one or all projects, default: all
    -i, --init                       initialise ehg workspace
    -c, --create [PROJECT]           create a new project from template, default: demo
    -h, --help                       Show this message

Usage Generators

There are several generators controlled by the project.yml configured like:

paths:
  src:
    images:     'assets/images'
    scripts:    'assets/scripts'
    styles:     'assets/styles'
    ...

generators:
  - structure:
      enabled: true

  - compile_coffee:
      enabled: true
      minimize: true
      selector: '**/*.js.coffee'

  - service_bower:
      enabled: true
      selector: 'bower.json'
      target: 'lib'

Generators

Generators are processed the way they appear in the project.yml. At the moment only one generator instance per project.yml is allowed. Every generator has the property enabled.

Basic-Generators

Structure

operates on: dist
creates necessary dist folders
config:

generators:
- structure: enabled: true

Copy

operates on: dist and src
copies folder or files from dist to src
config:

generators:
- copy: enabled: true dirs: - source: 'assets/styles' target: 'styles' selector: '/*.css' - source: 'assets/scripts' target: 'scripts' selector: '/*.js'

Combine

operates on: dist
combines merges files on dist
config:

generators:
- combine enabled: true packages: - file: 'scripts/combined.js' files: - 'scripts//*.js' - file: 'styles/combined.css' files: - 'styles//*.css'

Delete

operates on: dist
deletes files or folders on dist
config:

generators:
- delete enabled: false files: - '*'

Complie-Generators

Compile::Haml

operates on: dist and src
compiles haml files from src to html files in dist, supports partials and action view, supports minimizing
config:

generators:
- compile_haml: enabled: true minimize: true default_layout: 'views/layout.haml' selector: '*/.html.haml' renderer: attr_wrapper: '"' format: :html5 shared_helper_path: 'shared/lib'

Compile::Sass

operates on: dist and src
compiles sass files from src to css files in dist, supports shared mixins and minimizing
config:

generators:
- compile_sass: enabled: true minimize: true selector: '*/.css.sass'

Compile::Coffee

operates on: dist and src
compiles coffee files from src to js files in dist, supports minimizing
config:

generators:
- compile_coffee: enabled: true minimize: true selector: '*/.js.coffee'

Minimize-Generators

Minimize::Html

operates on: dist and src
minimizes src html files and copies to dist
config:

generators:
- minimize_html: enabled: true selector: '*/.html' prefix_extension: ''

Minimize::Css

operates on: dist and src
cminimizes src css files and copies to dist
config:

generators:
- minimize_css: enabled: true selector: '*/.css' prefix_extension: '.min'

Minimize::Js

operates on: dist and src
minimizes src js files and copies to dist
config:

generators:
- minimize_js: enabled: true selector: '*/.js' prefix_extension: '.min'

Minimize::Images

operates on: dist and src
minimizes src image files and copies to dist, uses Piet
config:

generators:
- minimize_images: enabled: true selector: '*/.jpg,jpeg,png' options: quality: 90 level: 3 verbose: true

Service-Generators

Service::Bower

operates on: dist and src
resolves my_project/bower.json and copies bower_components to target in dist
config:

generators:
- service_bower: enabled: true selector: 'bower.json' target: 'lib'

Service::Grunt

operates on: dist
resolves my_project/Gruntfile.coffee and runs a task
config:

generators:
- service_grunt: enabled: true selector: 'Gruntfile.coffee' task: 'default'

Service::Analytics

operates on: dist
appends google analytics code to selected html files
config:

generators:
- service_analytics: enabled: true append_to_files: - '*/.html' google: enabled: true code: "" id: -1