Skip to content

Commit

Permalink
[README] add new features to readme
Browse files Browse the repository at this point in the history
  • Loading branch information
brousalis committed Jul 17, 2016
1 parent 3c9a138 commit c974302
Showing 1 changed file with 46 additions and 30 deletions.
76 changes: 46 additions & 30 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@
# bendystraw [![NPM version](https://img.shields.io/npm/v/bendystraw.svg?style=flat-square)](https://www.npmjs.com/package/bendystraw)

<img src="http://i.imgur.com/Pdmetdq.png" alt="bendystraw" align="right" />
bendystraw is a set of [Gulp](https://github.com/gulpjs/gulp/) tasks for developing and deploying JavaScript-based apps.
bendystraw is an opinionated set of [Gulp](https://github.com/gulpjs/gulp/) tasks for developing and deploying javascript apps

Some features include [Browersync](https://www.browsersync.io/) development, multiple app environments and configuration, GitHub changelog and release creation, Slack integration, and much more...
Some features include Babel & CoffeeScript support, Angular specific features, [Browersync](https://www.browsersync.io/) development, multiple app environments, GitHub changelog and release creation, AWS deployment, Slack integration, and more.

## Usage

Expand All @@ -16,52 +16,69 @@ In order to use the gulp tasks, create a `gulpfile.js` with:
require('bendystraw')()
```

## Tasks

command | description
------- | ------------
`gulp` | defaults to server task
`gulp server` | builds the app to the dev folder and runs the Browsersync server
`gulp build` | builds the app to the build folder
`gulp release` | bumps version, tags, and creates a GitHub release based on `package.json`
`gulp deploy` | deploys the build folder to a S3 bucket, posts to Slack if configured
`gulp test` | runs tests using Karma
`gulp e2e` | run end to end tests with Protractor
## Config

All of these tasks can be run in different environments, ie: `gulp build --env staging`. This will then load `.env.staging` into the app.
bendystraw assumes you have a defined `source` folder to use the tasks. By default, it looks like this:

To see a full list of tasks, check out the [wiki](https://github.com/brousalis/bendystraw/wiki).
![Imgur](http://i.imgur.com/tSW7amn.png)

## Config
You can generate this structure by using `gulp scaffold`, or you can override it to fit your needs. Here's an example configuration:

To configure settings, paths, etc...
```javascript
require('bendystraw')({
paths: {
build: 'public', // Override the build folder name
styles: 'stylez', // Override the stylesheet source folder
styles: 'css', // Override the stylesheet source folder
},
html: {
preprocessor: require('gulp-jade'),
preprocessor: require('gulp-jade'), // Use a custom html preprocessor
},
styles: {
sassOptions: {
indentedSyntax: true // Use .sass indented syntax
},
uncss: true, // Enable uncss
autoprefixer: true
},
scripts: {
coffeescript: true,
babel: true, // Use babel es2015 preset
coffeescript: false,
sourcemaps: false
}
})
```
Check out all the config values [here](https://github.com/brousalis/bendystraw/blob/master/gulpfile.js/config.js)

> NOTE: `gulp scaffold` will generate an `index.html` file. This shows how bendystraw uses `gulp-inject` and `gulp-useref` to inject your app's javascript and create bundles. Make sure to change the paths in the file if you've overridden the defaults. Read more about it on the [wiki](https://github.com/brousalis/bendystraw/wiki#asset-injection).
## Tasks

command | description
------- | ------------
`gulp` | defaults to server task
`gulp server` | builds the app to the dev folder and runs the Browsersync server
`gulp build` | builds, minifys the app to the build folder (for production)
`gulp release` | bumps version, tags, and creates a GitHub release based on your `package.json`
`gulp deploy` | deploys the build folder to a S3 bucket, posts to Slack if configured
`gulp test` | runs tests using Karma
`gulp e2e` | runs end to end tests with Protractor

All of these tasks can be run in different environments, ie: `gulp build --env staging`. This will then load `.env.staging` into the app.

To see a full list of tasks, check out the [wiki](https://github.com/brousalis/bendystraw/wiki).

## Examples

For more in-depth explanation of the tasks and examples on how to configure your app, check out the [wiki](https://github.com/brousalis/bendystraw/wiki). There's also an example Angular app I use for testing, [bendystraw-test](https://github.com/brousalis/bendystraw-test).

## Features

- **JS:**
- Built-in Angular features
- Angular features (off by default)
- Dependency injection annotations
- Automatic file sorting to avoid injection issues
- File sorting to avoid injection issues
- Compiles html files to the Angular templateCache
- Babel es2015 support
- CoffeeScript support
- Sourcemaps
- Bower components automatically injected through [wiredep](https://github.com/taptapship/wiredep)
Expand All @@ -70,9 +87,9 @@ For more in-depth explanation of the tasks and examples on how to configure your
- Sass support, indented or scss using node-sass
- Sourcemaps
- Autoprefixer
- Uncss
- **HTML:**
- Any gulp-based preprocessor supported (gulp-haml, gulp-jade, etc)
- Minifies and compiles html template files to the Angular template cache
- Any gulp-based html preprocessor support (gulp-haml, gulp-jade, etc)
- **Images:**
- Image compression
- Grabs images from specified Bower components
Expand All @@ -82,18 +99,17 @@ For more in-depth explanation of the tasks and examples on how to configure your
- dotenv configuration output to window global or Angular constant for injection
- Environment specific logic in the views
- **Releasing:**
- GitHub tag and release support
- Changelog generation
- GitHub semantic tagging and release creation (based on your `package.json`)
- Changelog generation by comparing previous tag
- **Deployment:**
- Amazon S3 bucket deploys
- Asset revisioning (cache busting)
- Cloudfront CDN support
- Asset revisioning
- Cloudfront CDN url replacement support
- Slack deployment messages
- **Testing:**
- Karma tests
- End to end testing with Protractor
- `.spec.js` style and `/test` folder

## Thanks

bendystraw is inspired and based off of many Gulp projects. [gulp-starter](https://github.com/vigetlabs/gulp-starter/) by [vigetlabs](https://viget.com/extend) and [generator-gulp-angular](https://github.com/Swiip/generator-gulp-angular) for Yeoman by [Matthieu Lux](github.com/swiip). built at [Belly](http://github.com/bellycard)
bendystraw is inspired and based off of several Gulp projects. Big thanks to [gulp-starter](https://github.com/vigetlabs/gulp-starter/) by [vigetlabs](https://viget.com/extend) and [generator-gulp-angular](https://github.com/Swiip/generator-gulp-angular) by [Matthieu Lux](github.com/swiip)

0 comments on commit c974302

Please sign in to comment.