Webcomic greatness with Bootstrap + Grunt + Google App Engine
Uses Twitter Bootstrap for layout, Grunt to build the site dynamically and Google App Engine to host everything. Did I mention App Engine hosting is free?
Install the project by running:
npm install
This plugin requires Grunt Command-line interface grunt-cli
If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to install and use Grunt plugins. Once you're familiar with that process, you may compile this project with this command:
grunt
Once the compilation has ended, Grunt has compiled .json, .less and image files to proper .css, html and image files inside static/
folder
You can deploy this project to your own GAE site by running:
appcfg.py update static/app.yaml
Make sure to edit the app.yaml
project name before deploying.
See the grunt plugin sites for more information about customization and grunt options
You can easily use bootstrap themes from Bootswatch site:
- Select a theme
- Download
bootswatch.less
andvariables.less
files - Replace files at
src/less/
folder - Run
grunt
This project uses grunt-contrib-htmlmin to minify html, grunt-contrib-cssmin to minify css and grunt-uncss to remove unnecessary css generated by Bootstrap.
This project uses grunt-sitemap to generate sitemaps and grunt-robots-txt to generate robots.txt files.
All files are compiled from a single source file, templates/template.html
that gets it's data from comics/*.json
files.
The compiled .html files will be compiled to static/comics/[id]/index.html
The code in this project (including Bootstrap and Bootswatch theme) is licensed under MIT license (see LICENSE-MIT file).
The content (comics, comic images, texts in comics/*.json
files) is licensed under a Creative Commons Attribution-NonCommercial 2.5 License (see LICENSE-CC file).
Code styles are licensed under BSD license (see src/less/highlight.js-styles/LICESNSE-BSD file).