updated README
This commit is contained in:
parent
258cef8568
commit
7358678c98
58
README.md
58
README.md
|
@ -1,39 +1,83 @@
|
||||||
# Rapid RiotJS
|
# RiotJS App Starter
|
||||||
> A Starter kit
|
> 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.
|
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
|
### Features
|
||||||
|
|
||||||
- `RiotJS` 3.x
|
- `RiotJS` 3.x
|
||||||
- `Web Components` for reuseable UI
|
- `Web Components` for reuseable UI
|
||||||
- `Events` for communication
|
- `Events` for communication
|
||||||
- `Route` for url navigation
|
- `Route` for url navigation
|
||||||
- Based on `HTML5Boilerplate` 6.x
|
- `HTML5Boilerplate` 6.x static file base
|
||||||
- `JSCS` for coding style
|
- `ESLint` for coding style
|
||||||
- `Jasmine` for testing
|
|
||||||
- `Gulp` for production builds
|
- `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
|
## 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?
|
## Why Zero-Build?
|
||||||
|
|
||||||
**SPEED!**
|
**SPEED!**
|
||||||
|
|
||||||
A production pipe-line should *NOT* be in your way while developing...
|
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
|
## 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
|
## 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
|
## 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...
|
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.
|
...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
|
||||||
|
|
Loading…
Reference in New Issue