|
1 | 1 | # Documentation Home |
2 | 2 |
|
| 3 | +## Generators |
| 4 | + |
| 5 | +Available generators: |
| 6 | + |
| 7 | +* App |
| 8 | + - [angular-fullstack](/docs/generators/app.md) (aka [angular-fullstack:app](/docs/generators/app.md)) |
| 9 | +* Server Side |
| 10 | + - [angular-fullstack:endpoint](/docs/generators/endpoint.md) |
| 11 | +* Client Side |
| 12 | + - [angular-fullstack:route](/docs/generators/route.md) |
| 13 | + - [angular-fullstack:controller](/docs/generators/controller.md) |
| 14 | + - [angular-fullstack:filter](/docs/generators/filter.md) |
| 15 | + - [angular-fullstack:directive](/docs/generators/directive.md) |
| 16 | + - [angular-fullstack:service](/docs/generators/service.md) |
| 17 | + - [angular-fullstack:provider](/docs/generators/service.md) |
| 18 | + - [angular-fullstack:factory](/docs/generators/service.md) |
| 19 | + - [angular-fullstack:decorator](/docs/generators/decorator.md) |
| 20 | +* Deployment |
| 21 | + - [angular-fullstack:openshift](/docs/generators/openshift.md) |
| 22 | + - [angular-fullstack:heroku](/docs/generators/heroku.md) |
| 23 | + |
| 24 | + |
| 25 | +## Bower Components |
| 26 | + |
| 27 | +The following packages are always installed by the [app](#app) generator: |
| 28 | + |
| 29 | +* angular |
| 30 | +* angular-cookies |
| 31 | +* angular-mocks |
| 32 | +* angular-resource |
| 33 | +* angular-sanitize |
| 34 | +* es5-shim |
| 35 | +* font-awesome |
| 36 | +* json3 |
| 37 | +* jquery |
| 38 | +* lodash |
| 39 | + |
| 40 | +These packages are installed optionally depending on your configuration: |
| 41 | + |
| 42 | +* angular-route |
| 43 | +* angular-ui-router |
| 44 | +* angular-socket-io |
| 45 | +* angular-bootstrap |
| 46 | +* bootstrap |
| 47 | + |
| 48 | +All of these can be updated with `bower update` as new versions are released. |
| 49 | + |
| 50 | +## Injection |
| 51 | + |
| 52 | +A grunt/gulp task looks for new files in your `client/app` and `client/components` folder and automatically injects them in the appropriate places based on an injection block. |
| 53 | + |
| 54 | +* `less` files into `client/app/app.less` |
| 55 | +* `scss` files into `client/app/app.scss` |
| 56 | +* `stylus` files into `client/app/app.styl` |
| 57 | +* `css` files into `client/index.html` |
| 58 | +* `js` files into `client/index.html` |
| 59 | +* `babel`/`typescript` temp `js` files into `client/index.html` |
| 60 | +* `typescript types` into `tsconfig.client.json` & `tsconfig.client.test.json` |
| 61 | + |
| 62 | + |
| 63 | +## Configuration |
| 64 | +Yeoman generated projects can be further tweaked according to your needs by modifying project files appropriately. |
| 65 | + |
| 66 | +A `.yo-rc` file is generated for helping you copy configuration across projects, and to allow you to keep track of your settings. You can change this as you see fit. |
| 67 | + |
| 68 | +## Testing |
| 69 | + |
| 70 | +Running `grunt test` will run the client and server unit tests with karma and mocha. |
| 71 | + |
| 72 | +Use `grunt test:server` to only run server tests. |
| 73 | + |
| 74 | +Use `grunt test:client` to only run client tests. |
| 75 | + |
| 76 | +**Protractor tests** |
| 77 | + |
| 78 | +To setup protractor e2e tests, you must first run |
| 79 | + |
| 80 | +`npm run update-webdriver` |
| 81 | + |
| 82 | +Use `grunt test:e2e` to have protractor go through tests located in the `e2e` folder. |
| 83 | + |
| 84 | +**Code Coverage** |
| 85 | + |
| 86 | +Use `grunt test:coverage` to run mocha-istanbul and generate code coverage reports. |
| 87 | + |
| 88 | +`coverage/server` will be populated with `e2e` and `unit` folders containing the `lcov` reports. |
| 89 | + |
| 90 | +The coverage taget has 3 available options: |
| 91 | +- `test:coverage:unit` generate server unit test coverage |
| 92 | +- `test:coverage:e2e` generate server e2e test coverage |
| 93 | +- `test:coverage:check` combine the coverage reports and check against predefined thresholds |
| 94 | + |
| 95 | +* *when no option is given `test:coverage` runs all options in the above order* |
| 96 | + |
| 97 | +**Debugging** |
| 98 | + |
| 99 | +Use `grunt serve:debug` for a more debugging-friendly environment. |
| 100 | + |
| 101 | +## Environment Variables |
| 102 | + |
| 103 | +Keeping your app secrets and other sensitive information in source control isn't a good idea. To have grunt launch your app with specific environment variables, add them to the git ignored environment config file: `server/config/local.env.js`. |
| 104 | + |
| 105 | +## Project Structure |
| 106 | + |
| 107 | +Overview |
| 108 | + |
| 109 | + ├── client |
| 110 | + │ ├── app - All of our app specific components go in here |
| 111 | + │ ├── assets - Custom assets: fonts, images, etc… |
| 112 | + │ ├── components - Our reusable components, non-specific to to our app |
| 113 | + │ |
| 114 | + ├── e2e - Our protractor end to end tests |
| 115 | + │ |
| 116 | + └── server |
| 117 | + ├── api - Our apps server api |
| 118 | + ├── auth - For handling authentication with different auth strategies |
| 119 | + ├── components - Our reusable or app-wide components |
| 120 | + ├── config - Where we do the bulk of our apps configuration |
| 121 | + │ └── local.env.js - Keep our environment variables out of source control |
| 122 | + │ └── environment - Configuration specific to the node environment |
| 123 | + └── views - Server rendered views |
| 124 | + |
| 125 | +An example client component in `client/app` |
| 126 | + |
| 127 | + main |
| 128 | + ├── main.js - Routes |
| 129 | + ├── main.controller.js - Controller for our main route |
| 130 | + ├── main.controller.spec.js - Test |
| 131 | + ├── main.html - View |
| 132 | + └── main.less - Styles |
| 133 | + |
| 134 | +An example server component in `server/api` |
| 135 | + |
| 136 | + thing |
| 137 | + ├── index.js - Routes |
| 138 | + ├── thing.controller.js - Controller for our `thing` endpoint |
| 139 | + ├── thing.model.js - Database model |
| 140 | + ├── thing.socket.js - Register socket events |
| 141 | + └── thing.spec.js - Test |
0 commit comments