generator-jekyllized

Use Jekyll with Gulp, Yeoman, Bower, Bourbon and so much more!

npm install generator-jekyllized
1 downloads in the last day
14 downloads in the last week
29 downloads in the last month

generator-jekyllized Build Status

NPM version Coverage Status Dependency Status devDependency Status

Work in progress! Still unfinished.

Stylized and opinionated Jekyll development

Jekyllized is an opinionated Yeoman generator for building Jekyll based websites. Easy scaffolding via Yo to get started quickly, Bower for managing frontend packages and Gulp to automate and optimize developing your site.

Based on Jekyll, Jekyllized is ideal for building highly optimized static sites and prototyping sites. Quickly review changes with LiveReload, optimize your stylesheets and images automatically and detect errors and unused code in your project.

Features

Tools

Developing

  • Refresh and preview your site with LiveReload automatically
  • Detect errors and potential issues with your code using jekyll doctor, JShint and CSSLint
  • Automatically concatenate your files and optimize and minify your images, CSS, JavaScript and HTMl

Getting started

Installation

To install you need Node.js (>0.10.0) and Ruby (> 1.9) for Jekyll. Install Jekyllized via NPM: npm install -g generator-jekyllized and finally run yo jekyllized in the directory you want to install in.

Usage

gulp

The default task, this will automatically compile and open the site in your browser. A watch task runs in the background and detects when any files change, recompiles them if nessecary and updates your browser with LiveReload.

gulp check

Check the health of your JavaScript, CSS and Jekyll installation. You can change the settings for what it looks for in either .jshintrc or .csslintrc.

gulp build

Almost the same as the default gulp task, but this won't start up a preview/LiveReload server and open the browser, it will only build your site.

gulp publish

This will run the gulp build task first to make sure all changes are done, then it will optimize all the files. It will concatenate your CSS and JS, minify your HTML, CSS, JS and optimize your images.

Individual tasks

All the Gulp tasks are built up of smaller tasks, which can be run individually. For example, the gulp check task runs the tasks csslint, jslint and doctor. If you wanted to check for Jekyll problems intead of checking for everything else you only run gulp doctor.

For all the different tasks that can be run, see the gulpfile and look through the code. Everything is commented and you can edit, change or remove what you want/need.

Bower

Currently not implemented

Roadmap

  • Write more documentation
  • Implement Bower functionality
  • Maybe CoffeeScript
  • Probably some other stuff too

Changelog

npm loves you