Advanced Web Starter Kit
To boldly go where no man has gone before
How to use
- Clone or download and unpack to desired location
- Download and install latest version of node.js
- Install grunt-cli globally:
npm install -g grunt-cli
- Install jspm globally:
npm install -g jspm
- Install GraphicsMagick (recommended) or ImageMagick for your OS.
Note: it's mandatory to install one of them before running
- Set your environment variables [guide]
- Install project dependencies:
- (optional) Add your repository to Travis for automatic tests
- (optional) Set up Continuous Deployment with CircleCI or Werker Docker following our guide
- Code live with:
npm start or
npm run start-hmr if you need hot module reloading
- Build with:
npm run build
- Deploy and enjoy your life
- Reasonable structure for frontend projects
- Static pages generation
- Prepared configs for quick Continuous Deployment and automatic tests setup
- Grunt with pre-configured tasks
- Nunjucks, a full featured templating engine
- In-built Nunjucks globals and filters for formatting numbers, dates, getting current page url, locale, breadcrumb, etc.
- Human readable urls
- Boilerplate files based on best practices
- i18n with node-gettext and configured layouts to properly declare current locale and alternate urls
- Sass compiler with source maps generation, autoprefixing, optimization, minification and linting
- Ekzo Sass framework
- Live reload powered by Browser Sync
- Runtime type annotation and data validation with
tcomb-validation, built-in handy refinements.
- Preconfigured meta tags for Open Graph and Twitter Cards
- Commonly used by search providers structured data based on RDFa
sitemap.xml generation with grunt-sitemap-xml
- Automatic sprites generation with Spritesmith
- Automatic images compression via TinyPNG
- Automatic responsive images generation with grunt-responsive-images
- Separate not optimized files in development, and
- Compiled and minified files for production
And a lot more under the hood. We just didn't have time to document all features. Yet.
Work in progress
Deployed version of Kotsu from master branch can be found here.
Note that Examples section so far features only least part of predefined elements and features.
To enable ES6 features in IE11 and below, uncomment
import 'babel-polyfill' in
main.js. See details here.
Default build shipped with jQuery 3.1.0+ which doesn't support IE8. Replace it with pre 3.0.0 version if you need support of IE8.
Refer to Ekzo Browsers Support section for details about graceful regression for IE9 and below, which included in Kotsu by default.
To disable graceful regressions for older IE, remove
IE() macro call from base layout.
Outdated Browser message
In IE9 and below users will see banner before page content with message about outdated browser and link to Outdated Browser.
To disable Outdated Browser message, remove
OutdatedBrowser() macro call from base layout.
Copyright 2014 LotusTM. Licensed under the Apache 2.0 license.