Flight generator


A Yeoman generator for
Flight, Twitter's client-side JavaScript
framework. Get up and running with everything you need to create an
application.
A separate Flight package generator
is available for creating standalone Flight components.

NOTE: This project is forked from from flight/generator-flight. It is modified for the usage of project unitedstackfront/ued.

Recommended setup

Install Node.js (which comes with npm). It's best to have
npm version 1.2.x or above installed.

Next, globally install the Flight generator. This will automatically install
Bower and Yo as global dependencies.
These tools will help manage your dependencies and generate the boilerplate
Flight application.

``
npm install -g generator-flight
`

Make a new directory, and cd into it:

`
mkdir flight-app && cd $_
`

You're now ready to generate an app!

Usage for unitedstackfront/ued

First Create a globally-installed symbolic link from this project.

`
npm link
`

Next, in some other location(like the unitedstackfront/ued work-directory), create a
symlink from the local node_modules folder to the global symlink.

`
npm link generator-flight
`

Main generator

To generate a Flight-based application:

`
yo flight
`

N.B. All your Node and client-side dependencies will be installed
automatically unless you include the --skip-install option.

All generators and their output

Available generators (to be run in the root directory of a project).

* flight (aka flight:app)
* flight:component
* flight:mixin
* flight:page
* flight:all

$3

Scaffolds a Flight application file structure, installs all the library code
you need, and correctly configures your test setup. The app generator will
prompt you to optionally install Bootstrap or Normalize.css.

Example:

`
yo flight my_app
`

Produces:

`
.
├── app
│ ├── css
│ │ └── main.css
│ ├── lib
│ │ ├── flight
│ │ ├── jasmine
│ │ ├── jasmine-flight
│ │ ├── jquery
│ │ ├── jsx-requirejs-plugin
│ │ ├── react
│ │ ├── requirejs
│ │ ├── requirejs-test
│ │ └── router
│ ├── js
│ │ ├── component
| | ├── mixin
| | ├── service
| | ├── templates
│ │ ├── page
│ │ │ └── default.js
│ │ └── main.js
│ ├── 404.html
│ ├── favicon.ico
│ ├── index.html
│ └── robots.txt
├── node_modules
├── test
│ └── test-main.js
├── .bowerrc
├── .gitattributes
├── .gitignore
├── .jshintrc
├── .travis.yml
├── CONTRIBUTING.md
├── LICENSE.md
├── README.md
├── bower.json
├── gulpfile.js
├── karma.conf.js
└── package.json
`

#### Locally installed software

Automatically installs all the Flight framework dependencies, and sets up a
Node-based toolchain for your development workflow.

via Bower

* Flight (and its dependencies: ES5 Shim, jQuery)
* RequireJS
* Jasmine jQuery extensions
* Jasmine Flight extensions
* (optional) Bootstrap
* (optional) Normalize.css

via npm

* Flight generator (installed as a local dependency)
* Gulp task runner
* Karma unit test runner
* Node-Static file server

$3

Generates a component in app/js/component.

Example:

`
yo flight:component tweet_box
`

Produces app/js/component/tweet_box.js:

`js
define(function (require) {
var defineComponent = require('flight/lib/component');

return defineComponent(tweetBox);

function tweetBox() {
this.attributes({});
this.after('initialize', function () {});
}
});
`

And the test file test/spec/component/tweet_box.spec.js:

`js
describeComponent('component/tweet_box', function () {
// Initialize the component and attach it to the DOM
beforeEach(function () {
this.setupComponent();
});

it('should be defined', function () {
expect(this.component).toBeDefined();
});

it('should do something', function () {
expect(true).toBe(false);
});
});
`

$3

Generates a mixin component in app/js/mixin.

Example:

`
yo flight:mixin tweet_actions
`

Produces app/js/mixin/tweet_actions.js:

`js
define(function (require) {
return TweetActions;

function TweetActions() {
this.attributes({});
this.after('initialize', function () {});
}
});
`

And the test file test/spec/mixin/tweet_box.spec.js:

`js
describeMixin('mixin/tweet_box', function () {
// Initialize the component and attach it to the DOM
beforeEach(function () {
this.setupComponent();
});

it('should be defined', function () {
expect(this.component).toBeDefined();
});

it('should do something');
});
`

$3

Generates a page component in app/js/page.

Example:

`
yo flight:page settings
`

Produces app/js/page/settings.js:

`js
define(function (require) {
// var myComponent = require('component/my_component');

return initialize;

function initialize() {
// myComponent.attachTo(document);
}
});
`

$3

Shortcut that runs flight:app, flight:component my_component, and
flight:mixin my_mixin`.

Developing your application

The generated application's README
contains instructions on how to run the tests, server, and other tasks.

Contributing to this project

Anyone and everyone is welcome to contribute. Please take a moment to
review the guidelines for contributing.

* Bug reports
* Feature requests
* Pull requests

Authors

* Nicolas Gallagher @necolas

License

Copyright 2013 Twitter, Inc and other contributors.

Licensed under the MIT License.