From 7358678c98c47def5249d5df1242853928569381 Mon Sep 17 00:00:00 2001 From: Geoff Doty Date: Fri, 30 Nov 2018 05:17:45 -0500 Subject: [PATCH] updated README --- README.md | 60 +++++++++++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 52 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index f766014..f1be7ea 100644 --- a/README.md +++ b/README.md @@ -1,39 +1,83 @@ -# Rapid RiotJS -> A Starter kit +# 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 + - `Events` for communication - `Route` for url navigation -- Based on `HTML5Boilerplate` 6.x -- `JSCS` for coding style -- `Jasmine` for testing +- `HTML5Boilerplate` 6.x static file base +- `ESLint` for coding style - `Gulp` for production builds - - `Rollup` to only export the code your using + +### 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` adds it when you need it +...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