diff --git a/README.md b/README.md index fe3c5c2..8a311a5 100644 --- a/README.md +++ b/README.md @@ -1,21 +1,21 @@ # generator-rf [![Build Status](https://secure.travis-ci.org/taiansu/generator-rf.png?branch=master)](https://travis-ci.org/taiansu/generator-rf) [![Gitter](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/taiansu/generator-rf?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) -> RF: a [React](http://facebook.github.io/react/)/[Flux](http://facebook.github.io/flux/) generator with webpack, dialects and some good stuffs. +> RF: a [React](http://facebook.github.io/react/)/[Flux](http://facebook.github.io/flux/) generator with Webpack, multiple JavaScript and Stylesheet dialects, Bootstrap, and some more good stuff. ### What's inside * [React](http://facebook.github.io/react/) * [Flux](http://facebook.github.io/flux/) * [Jest](http://facebook.github.io/jest) -* [webpack](http://webpack.github.io/) +* [Webpack](http://webpack.github.io/) * SourceMap from webpack's [devtool](http://webpack.github.io/docs/configuration.html#devtool) * Live-reload by [react-hot-loader](https://gaearon.github.io/react-hot-loader/) -* JS dialect in your favor: - * ES6 powered by [Babel](https://babeljs.io/) (Formally Javascript 6to5) +* Your favorite JS dialect: + * ES6 powered by [Babel](https://babeljs.io/) (formally JavaScript 6to5) * [CoffeeScript](http://coffeescript.org/) * [LiveScript](http://livescript.net) * vanilla JavaScript * Have JSX in CoffeeScript/LiveScript by [coffee-react-transform](https://github.com/jsdf/coffee-react-transform) -* Stylesheet syntax in your favor: +* Your favorite Stylesheet syntax: * [SASS/SCSS](http://sass-lang.com/) * [Less](http://lesscss.org/) * [Stylus](http://learnboost.github.io/stylus/) @@ -24,26 +24,26 @@ ### What 'RF' stands for -No, not the boring abbreviation of "React" and "Flux". It's actually the suffix of `rm -rf`. Now it sounds [dangerous](https://github.com/MrMEEE/bumblebee-Old-and-abbandoned/issues/123) and cooler, doesn't it? +No, it's not the boring abbreviation of "React" and "Flux". It's actually the suffix of `rm -rf`. Now it sounds more [dangerous](https://github.com/MrMEEE/bumblebee-Old-and-abbandoned/issues/123) and cool, doesn't it? ## Installation ### Prerequisites * [Node.js w/npm](http://nodejs.org/) or [iojs](https://iojs.org/) installed. I - recommend install it by [nvm](https://github.com/creationix/nvm). Mac user can + recommend installing it using [nvm](https://github.com/creationix/nvm). Mac users can install nvm from [homebrew](http://brew.sh/). -> Note: Jest doesn't work on `io.js` & `node v0.11 ~ v0.12`, -> if you like to have jest works, make sure you use `node.js 4.0` above or `v0.10` +> Note: Jest doesn't work on `io.js` & `node v0.11 ~ v0.12`. +> If you would like to use Jest, make sure you use `node.js 4.0` or above or `v0.10` -### Install [Yeoman](http://yeoman.io) +### Installing [Yeoman](http://yeoman.io) ```bash npm install -g yo ``` -### Install RF generator +### Installing the RF generator ```bash npm install -g generator-rf @@ -51,30 +51,30 @@ npm install -g generator-rf ## Getting Started -### Intiate Project +### Initiating a Project -For example, to create a project named "myapp", just type: +To create a project named "myapp", just type: ```bash yo rf myapp ``` -### Run it up +### Running the dev server ```bash cd myapp && npm run dev ``` -Then Open [http://localhost:8080](http://localhost:8080) in the browser and have fun! +Then open [http://localhost:8080](http://localhost:8080) in your browser and have fun! -### Run the test suit -Don't forget to test your project by: +### Running the test suite +Don't forget to test your project by running: ```bash npm test ``` -### Build for deploy +### Building for deployment ``` npm run build @@ -112,8 +112,8 @@ npm run build ├── webpack.dev.config.js └── webpack.prod.config.js -* \* Won't create root directory if your current directory is identical with your project name. Check [--skip-root](#--skip-root-dont-create-root-directory) section for detail. -* \*\* Varied by your choices of the dialect and stylesheet syntax +* \* It won't create the root directory if your current directory is identical with your project name. Check the [--skip-root](#--skip-root-dont-create-root-directory) section for details. +* \*\* Varied by your choices of dialect and stylesheet syntax ## What `npm run build` gives: @@ -121,7 +121,7 @@ npm run build └── myapp ├── build │   ├── bundle.js - │   ├── some bootstrap stuffs (if include) + │   ├── some Bootstrap stuff (if included) │   └── ... └── ... @@ -129,10 +129,10 @@ npm run build ### --d: Dialect -By default, RF will generate codes in ES6, using [Babel](https://babeljs.io/). If you don't like it, use --d flag to change the dialect to generate. +By default, RF will generate ES6 code using [Babel](https://babeljs.io/). Use `--d` flag to change the dialect to generate. * `ls` for [LiveScript](http://livescript.net) -* `coffee` for [coffee-script](http://coffeescript.org/) +* `coffee` for [CoffeeScript](http://coffeescript.org/) * `js` for vanilla JavaScript Example: @@ -141,28 +141,28 @@ Example: ### --s: Stylesheet Syntax -RF generate [SASS](http://sass-lang.com/) (indented syntax) by default. Use --s flag to change it. +RF generate [SASS](http://sass-lang.com/) (indented syntax) by default. Use the `--s` flag to change it. * `scss` for SCSS (Sassy CSS) * `less` for LESS * `stylus` for Stylus -* or `css` for CSS. +* `css` for CSS. Example: yo rf myapp --s=scss -### --skip-bootstrap: Don't include Bootstrap framework stuffs +### --skip-bootstrap: Don't include the Bootstrap framework -RF includes Bootstrap settings in the real __Webpack__ way. Turn them off by --skip-bootstrap flag. +RF includes Bootstrap settings in the proper __Webpack__ way. Skip them by using the `--skip-bootstrap` flag. Example: yo rf myapp --skip-bootstrap -### --skip-root: Don't create root directory +### --skip-root: Don't create the root directory -RF creates a root directory if current directory name is different from your appname, or generate files in current directory if they have same name. But if you're intentionally have them with different name, use --skip-root to generate files right in the current directory. +RF creates a root directory if the current directory name is different from your app name, or generate files in the current directory if the have the same name. But if you intent to give them different names, use `--skip-root` to generate files in the current directory. Example: @@ -170,8 +170,7 @@ Example: ### --skip-test: Don't create \_\_tests\_\_ directories -For every sub-directories in `src/scripts`, RF will create a \_\_tests\_\_ directory -within. Use `skip-test` to skip that. +RF will create a `__tests__` directory in every subdirectory of `src/scripts`. Use the `--skip-test` flag to skip that. Example: @@ -183,20 +182,20 @@ Example: yo rf myapp --skip-install -## Contribute +## Contributing * Fork this project -* run `npm install && npm test` and make sure all test are pass -* Make your changes with [a bit of test](http://yeoman.io/authoring/testing.html) -* For commit message of pull request, please check [these useful tips](http://robots.thoughtbot.com/5-useful-tips-for-a-better-commit-message) ahead. +* run `npm install && npm test` and make sure all test pass +* Make your changes include [a couple of tests](http://yeoman.io/authoring/testing.html) +* For the commit message of the pull request, please check [these useful tips](http://robots.thoughtbot.com/5-useful-tips-for-a-better-commit-message) in advance. ## TODO * PostCSS support -* Actions w/Constants, Store +* Actions with Constants, Stores * Custom template folder -* Component and Mixin generate command -* Isomorphic server script(?) +* Component and Mixin generation commands +* Isomorphic server script (?) ## License