Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/andrewscwei/generator-vars-jekyll

Generator for raw web app with CircleCI, Jekyll, Webpack, Express + more.
https://github.com/andrewscwei/generator-vars-jekyll

circleci generator gulp heroku jekyll webpack yeoman

Last synced: 4 months ago
JSON representation

Generator for raw web app with CircleCI, Jekyll, Webpack, Express + more.

Awesome Lists containing this project

README

        

# generator-vars-jekyll ![](https://img.shields.io/maintenance/no/2016)

Yeoman generator for a Jekyll-based web app.

## Features

- [Jekyll](http://jekyllrb.com) `v3.1`
- Fast HTML compression using [https://github.com/penibelst/jekyll-compress-html](https://github.com/penibelst/jekyll-compress-html)
- [Gulp](http://gulpjs.com) asset pipeline
- [Sass](http://sass-lang.com) -> minified CSS
- [Babel](https://babeljs.io) ES6 -> ES5
- Static asset revisioning (appending content hash to filenames)
- [Webpack](https://webpack.github.io/)
- [BrowserSync](http://www.browsersync.io) as dev server
- [Heroku](http://heroku.com) integration
- [CircleCI](https://circleci.com/) integration
- CDN path remapping
- [H5BP favicon and app icon template](http://littlewebgiants.com/favicon-and-app-icon-template/)
- Automatically manages and concats legacy JS libraries (i.e. ``) in a designated folder

## Requirements

1. [Node](https://nodejs.org) `>=v5.0.0`
2. [Ruby](https://www.ruby-lang.org/en/) `>=v2.3.0`
3. [Bundler](http://bundler.io/)

## Structure

```
.
+-- .babelrc
+-- .buildpacks
+-- .editorconfig
+-- .gitignore
+-- .jshintrc
+-- .taskconfig
+-- app
| +-- .jshintrc
| +-- _assets
| | +-- stylesheets
| | | +-- base
| | | | +-- definitions.scss
| | | | +-- layout.scss
| | | | +-- typography.scss
| | | +-- main.scss
| | +-- fonts
| | +-- images
| | +-- javascripts
| | | +-- main.js
| | +-- vendor
| | +-- videos
| +-- _data
| +-- _drafts
| +-- _includes
| +-- _layouts
| | +-- compress.html
| | +-- default.html
| +-- _posts
| +-- 404.html
| +-- 500.html
| +-- index.html
| +-- apple-touch-icon-180x180-precomposed.png
| +-- apple-touch-icon-152x152-precomposed.png
| +-- apple-touch-icon-144x144-precomposed.png
| +-- apple-touch-icon-120x120-precomposed.png
| +-- apple-touch-icon-114x114-precomposed.png
| +-- apple-touch-icon-76x76-precomposed.png
| +-- apple-touch-icon-72x72-precomposed.png
| +-- apple-touch-icon-60x60-precomposed.png
| +-- apple-touch-icon-57x57-precomposed.png
| +-- apple-touch-icon-precomposed.png
| +-- browserconfig.xml
| +-- favicon.ico
| +-- favicon.png
| +-- large.png
| +-- launcher-icon-0-75x.png
| +-- launcher-icon-1-5x.png
| +-- launcher-icon-1x.png
| +-- launcher-icon-2x.png
| +-- launcher-icon-3x.png
| +-- launcher-icon-4x.png
| +-- manifest.json
| +-- og-image.png
| +-- robots.txt
| +-- square.png
| +-- tiny.png
| +-- wide.png
+-- node_modules
+-- public
+-- test
| +-- .jshintrc
| +-- index.js
+-- vendor
| +-- bundle
+-- _config.yml
+-- _prose.yml
+-- circle.yml
+-- Gemfile
+-- gulpfile.babel.js
+-- package.json
+-- README.md
+-- server.js
```

## Usage

Install `yo` and `generator-vars-jekyll`:
```
$ npm install -g yo generator-vars-jekyll
```

Create a new directory for your project and `cd` into it:
```
$ mkdir new-project-name && cd $_
```

Generate the project:
```
$ yo vars-jekyll [app-name]
```

For details on initial setup procedures of the project, see its generated ```README.md``` file.

## Release Notes

### 3.0.0
1. Removed optional libraries. The goal of this generator is just to provide a boilerplate without unnecessary dependencies.
2. Replaced Browserify with Webpack.
3. Build/asset pipeline is now mainly driven by NPM scripts (although the core is still Gulp).
4. Updated Jekyll to v3 and Node to v5.
5. Updated NPM packages and Gems.
6. Added CircleCI default integration (with Heroku).
7. Added compatibility with the [HTML5 boilerplate favicon template](https://drublic.de/archive/html5-boilerplate-favicons-psd-template/).
8. Added CDN support.
9. Many other optimizations.

### 2.0.0
1. Updated version numbers of NPM package dependencies.
2. Gulp tasks are now compressed into fewer files. As a result `require-dir` dependency is no longer necessary and is removed from `package.json`.
3. Task configurations are now stored in `./tasks/.taskconfig`.
4. Static files such as images, stylesheets, and JavaScripts are now stored in `app/_assets` (instead of `app/assets`). These files are no longer generated by the Jekyll generator and are now being deployed by the Gulp pipeline. This is for faster development iteration using `gulp-watch`. As a result, liquid templating static files is discouraged.
5. `favicon.png`, Apple touch and Open Graph specific icons are now moved to `app/_assets/images`. `favicon.ico` remains in the root directory.
6. `gulp-imagemin` is removed because it is the most taxing task in the Gulp pipeline. Images should be optimized outside of the Gulp pipeline instead.
6. Ruby version from `2.0.0` to `2.2.1`.
7. Minor syntactic sugar changes.
8. Lots of optimizations, particularly boosting the efficiency of automated rebuilds during development.