riot-starter/README.md

# RiotJS App Starter
> A Rapid Application Starter kit for RiotJS

Rapidly prototype your next single-page application, with a `zero-build` out-of-the-box web-component solution. Need to go beyond the prototype stage, fret not, the tools are in-place to take you to production.

This is built as simple as possible, but no simplier

### Features

- `RiotJS` 3.x
    - `Web Components` for reuseable UI
    - `Events` for communication
    - `Route` for url navigation
- `HTML5Boilerplate` 6.x static file base
- `ESLint` for coding style
- `Gulp` for production builds

### Requirements

[NodeJS](https://nodejs.org/) is used to install `vendor/` dependencies and a method to `build` your project for production via `gulp`

## Getting Started

1. Run `npm install` to load vendor dependencies

2. Start coding in `src/public`

3. run the `public/index.html` from your favorite web server\*

> \* try `live-server` from `npm` or via [Visual Studio Code]() plug-in

## Why Zero-Build?

**SPEED!**

A production pipe-line should *NOT* be in your way while developing...

...however, `npm build` is there when you need it

## How

`RiotJS` is blazing fast, outside of a production build, this project uses the `runtime-compiler` that can easily handle thousands of tags/actions in hundreds of milliseconds.

### Build

When you are ready to move to production you can run `npm build`.  This will create a `dist` folder with all your optimized assets, web-components, vendor dependencies and remove the riot `runtime-compiler` to shave off another 100kb

Check out the [gulpfile]('gulpfile.js') for all the build options if you do not want to build everything.  Every task is commented, and split-up so you can grep it easily.

## Project Structure

```
docs/                 <-- additional documentation
src/
    public/           <-- development is done here
       css/           <-- your css files
       js/            <-- your javascript files
       images/        <-- your images
       tags/          <-- web-components
       vendor/        <-- vendor dependencies, ie code you did not write
       index.html     <-- start here
       ...            <-- web meta files
test/                 <-- tests (one day)
gulpfile.js           <-- task runner
README.md
...                   <-- project meta files
```

## Polyfills

Todays "Evergreens" browsers support 99% of `ES6`, providing a pethra of capabilities, such as `import`, `class`, `fetch`, and `promise`.  Depending on your desired browser support, you may find a polyfill to suit your needs...

...but such is beyond the scope of *this* starter kit.

## Testing

- TBD

## TODO

- integrate Jasmine for tests
- bring in ajax lib (n2geoff/riot-http) for non-es6 environments?
- add routing example