diff --git a/.babelrc b/.babelrc
new file mode 100644
index 0000000..c71d366
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,4 @@
+{
+ "plugins": ["transform-runtime"],
+ "presets": ["es2015", "stage-0"]
+}
diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 0000000..cd01f84
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,21 @@
+# EditorConfig is awesome: http://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+charset = utf-8
+# Force Unix-style newlines with a newline ending every file & trim trailing whitespace
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.{js,html,css,styl}]
+indent_style = space
+indent_size = 2
+
+[*.md]
+indent_style = space
+indent_size = 4
+trim_trailing_whitespace = false
+
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..f31eec2
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,7 @@
+.DS_Store
+.tmp
+.git
+node_modules
+.settings
+*.log
+dist/
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..9e26dfe
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1 @@
+{}
\ No newline at end of file
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..8dada3e
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,201 @@
+ Apache License
+ Version 2.0, January 2004
+ http://www.apache.org/licenses/
+
+ TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+ 1. Definitions.
+
+ "License" shall mean the terms and conditions for use, reproduction,
+ and distribution as defined by Sections 1 through 9 of this document.
+
+ "Licensor" shall mean the copyright owner or entity authorized by
+ the copyright owner that is granting the License.
+
+ "Legal Entity" shall mean the union of the acting entity and all
+ other entities that control, are controlled by, or are under common
+ control with that entity. For the purposes of this definition,
+ "control" means (i) the power, direct or indirect, to cause the
+ direction or management of such entity, whether by contract or
+ otherwise, or (ii) ownership of fifty percent (50%) or more of the
+ outstanding shares, or (iii) beneficial ownership of such entity.
+
+ "You" (or "Your") shall mean an individual or Legal Entity
+ exercising permissions granted by this License.
+
+ "Source" form shall mean the preferred form for making modifications,
+ including but not limited to software source code, documentation
+ source, and configuration files.
+
+ "Object" form shall mean any form resulting from mechanical
+ transformation or translation of a Source form, including but
+ not limited to compiled object code, generated documentation,
+ and conversions to other media types.
+
+ "Work" shall mean the work of authorship, whether in Source or
+ Object form, made available under the License, as indicated by a
+ copyright notice that is included in or attached to the work
+ (an example is provided in the Appendix below).
+
+ "Derivative Works" shall mean any work, whether in Source or Object
+ form, that is based on (or derived from) the Work and for which the
+ editorial revisions, annotations, elaborations, or other modifications
+ represent, as a whole, an original work of authorship. For the purposes
+ of this License, Derivative Works shall not include works that remain
+ separable from, or merely link (or bind by name) to the interfaces of,
+ the Work and Derivative Works thereof.
+
+ "Contribution" shall mean any work of authorship, including
+ the original version of the Work and any modifications or additions
+ to that Work or Derivative Works thereof, that is intentionally
+ submitted to Licensor for inclusion in the Work by the copyright owner
+ or by an individual or Legal Entity authorized to submit on behalf of
+ the copyright owner. For the purposes of this definition, "submitted"
+ means any form of electronic, verbal, or written communication sent
+ to the Licensor or its representatives, including but not limited to
+ communication on electronic mailing lists, source code control systems,
+ and issue tracking systems that are managed by, or on behalf of, the
+ Licensor for the purpose of discussing and improving the Work, but
+ excluding communication that is conspicuously marked or otherwise
+ designated in writing by the copyright owner as "Not a Contribution."
+
+ "Contributor" shall mean Licensor and any individual or Legal Entity
+ on behalf of whom a Contribution has been received by Licensor and
+ subsequently incorporated within the Work.
+
+ 2. Grant of Copyright License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ copyright license to reproduce, prepare Derivative Works of,
+ publicly display, publicly perform, sublicense, and distribute the
+ Work and such Derivative Works in Source or Object form.
+
+ 3. Grant of Patent License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ (except as stated in this section) patent license to make, have made,
+ use, offer to sell, sell, import, and otherwise transfer the Work,
+ where such license applies only to those patent claims licensable
+ by such Contributor that are necessarily infringed by their
+ Contribution(s) alone or by combination of their Contribution(s)
+ with the Work to which such Contribution(s) was submitted. If You
+ institute patent litigation against any entity (including a
+ cross-claim or counterclaim in a lawsuit) alleging that the Work
+ or a Contribution incorporated within the Work constitutes direct
+ or contributory patent infringement, then any patent licenses
+ granted to You under this License for that Work shall terminate
+ as of the date such litigation is filed.
+
+ 4. Redistribution. You may reproduce and distribute copies of the
+ Work or Derivative Works thereof in any medium, with or without
+ modifications, and in Source or Object form, provided that You
+ meet the following conditions:
+
+ (a) You must give any other recipients of the Work or
+ Derivative Works a copy of this License; and
+
+ (b) You must cause any modified files to carry prominent notices
+ stating that You changed the files; and
+
+ (c) You must retain, in the Source form of any Derivative Works
+ that You distribute, all copyright, patent, trademark, and
+ attribution notices from the Source form of the Work,
+ excluding those notices that do not pertain to any part of
+ the Derivative Works; and
+
+ (d) If the Work includes a "NOTICE" text file as part of its
+ distribution, then any Derivative Works that You distribute must
+ include a readable copy of the attribution notices contained
+ within such NOTICE file, excluding those notices that do not
+ pertain to any part of the Derivative Works, in at least one
+ of the following places: within a NOTICE text file distributed
+ as part of the Derivative Works; within the Source form or
+ documentation, if provided along with the Derivative Works; or,
+ within a display generated by the Derivative Works, if and
+ wherever such third-party notices normally appear. The contents
+ of the NOTICE file are for informational purposes only and
+ do not modify the License. You may add Your own attribution
+ notices within Derivative Works that You distribute, alongside
+ or as an addendum to the NOTICE text from the Work, provided
+ that such additional attribution notices cannot be construed
+ as modifying the License.
+
+ You may add Your own copyright statement to Your modifications and
+ may provide additional or different license terms and conditions
+ for use, reproduction, or distribution of Your modifications, or
+ for any such Derivative Works as a whole, provided Your use,
+ reproduction, and distribution of the Work otherwise complies with
+ the conditions stated in this License.
+
+ 5. Submission of Contributions. Unless You explicitly state otherwise,
+ any Contribution intentionally submitted for inclusion in the Work
+ by You to the Licensor shall be under the terms and conditions of
+ this License, without any additional terms or conditions.
+ Notwithstanding the above, nothing herein shall supersede or modify
+ the terms of any separate license agreement you may have executed
+ with Licensor regarding such Contributions.
+
+ 6. Trademarks. This License does not grant permission to use the trade
+ names, trademarks, service marks, or product names of the Licensor,
+ except as required for reasonable and customary use in describing the
+ origin of the Work and reproducing the content of the NOTICE file.
+
+ 7. Disclaimer of Warranty. Unless required by applicable law or
+ agreed to in writing, Licensor provides the Work (and each
+ Contributor provides its Contributions) on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+ implied, including, without limitation, any warranties or conditions
+ of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+ PARTICULAR PURPOSE. You are solely responsible for determining the
+ appropriateness of using or redistributing the Work and assume any
+ risks associated with Your exercise of permissions under this License.
+
+ 8. Limitation of Liability. In no event and under no legal theory,
+ whether in tort (including negligence), contract, or otherwise,
+ unless required by applicable law (such as deliberate and grossly
+ negligent acts) or agreed to in writing, shall any Contributor be
+ liable to You for damages, including any direct, indirect, special,
+ incidental, or consequential damages of any character arising as a
+ result of this License or out of the use or inability to use the
+ Work (including but not limited to damages for loss of goodwill,
+ work stoppage, computer failure or malfunction, or any and all
+ other commercial damages or losses), even if such Contributor
+ has been advised of the possibility of such damages.
+
+ 9. Accepting Warranty or Additional Liability. While redistributing
+ the Work or Derivative Works thereof, You may choose to offer,
+ and charge a fee for, acceptance of support, warranty, indemnity,
+ or other liability obligations and/or rights consistent with this
+ License. However, in accepting such obligations, You may act only
+ on Your own behalf and on Your sole responsibility, not on behalf
+ of any other Contributor, and only if You agree to indemnify,
+ defend, and hold each Contributor harmless for any liability
+ incurred by, or claims asserted against, such Contributor by reason
+ of your accepting any such warranty or additional liability.
+
+ END OF TERMS AND CONDITIONS
+
+ APPENDIX: How to apply the Apache License to your work.
+
+ To apply the Apache License to your work, attach the following
+ boilerplate notice, with the fields enclosed by brackets "{}"
+ replaced with your own identifying information. (Don't include
+ the brackets!) The text should be enclosed in the appropriate
+ comment syntax for the file format. We also recommend that a
+ file or class name and description of purpose be included on the
+ same "printed page" as the copyright notice for easier
+ identification within third-party archives.
+
+ Copyright {yyyy} {name of copyright owner}
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..7a53c61
--- /dev/null
+++ b/README.md
@@ -0,0 +1,179 @@
+
+
+ 
+
+
+
+---
+
+
+
+ 
+
+
+
+
+# NG6 [](https://angularclass.com/slack-join) [](https://gitter.im/angularclass/NG6-starter?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+
+> The de facto starter repo for building scalable apps with [Angular](https://angularjs.org), [ES6](https://git.io/es6features), and [Webpack](http://webpack.github.io/)
+
+This repo serves as a minimal starter for those looking to get up-and-running with Angular and ES6, using [Gulp](http://gulpjs.com/) and [Webpack](http://webpack.github.io/) for the build process.
+**This seed is not a Yeoman generator.** It's a minimal starter with tasks for building the boilerplate. **These are its features**:
+* The best practice in directory/file organization for Angular (allowing for infinite horizontal app scaling)
+* A ready-to-go build system for working with [ES6](https://git.io/es6features)
+* Tasks for generating additional boilerplate Angular components
+* A full testing system in place
+* [Stylus](https://learnboost.github.io/stylus/) support
+
+**Check out the [JSPM version](https://github.com/angularclass/NG6-starter/tree/jspm)--an alternative to Webpack as an ES6 build system.**
+
+> If you're looking for a preliminary [Angular 2](https://angular.io/) build, please use the [angular2-webpack-starter](https://github.com/angularclass/angular2-webpack-starter).
+___
+
+# Table of Contents
+* [Walkthrough](#walkthrough)
+ * [Build System](#build-system)
+ * [File Structure](#file-structure)
+ * [Testing Setup](#testing-setup)
+* [Getting Started](#getting-started)
+ * [Dependencies](#dependencies)
+ * [Installing](#installing)
+ * [Running the App](#running-the-app)
+ * [Gulp Tasks](#gulp-tasks)
+ * [Testing](#testing)
+ * [Generating Components](#generating-components)
+* [Starter Kit Support and Questions](#starter-kit-support-and-questions)
+
+# Walkthrough
+## Build System
+NG6 uses Gulp and Webpack together for its build system. Yes, you don't need Gulp if you're using Webpack. This is true if your build system is only responsible for file manipulation. However, ours is not.
+
+`Webpack` handles all file-related concerns:
+* Transpiling from ES6 to ES5 with `Babel`
+* Loading HTML files as modules
+* Transpiling stylesheets and appending them to the DOM
+* Refreshing the browser and rebuilding on file changes
+* Hot module replacement for transpiled stylesheets
+* Bundling the app
+* Loading all modules
+* Doing all of the above for `*.spec.js` files as well
+
+`Gulp` is the orchestrator:
+* Starting and calling Webpack
+* Starting a development server (yes, Webpack can do this too)
+* Generating boilerplate for the Angular app
+
+**Check out the [JSPM version](https://github.com/angularclass/NG6-starter/tree/jspm)--an alternative to Webpack as an ES6 build system.**
+
+## File Structure
+We use a componentized approach with NG6. This will be the eventual standard (and particularly helpful, if using Angular's new router) as well as a great way to ensure a tasteful transition to Angular 2, when the time is ripe. Everything--or mostly everything, as we'll explore (below)--is a component. A component is a self-contained concern--may it be a feature or strictly-defined, ever-present element of the UI (such as a header, sidebar, or footer). Also characteristic of a component is that it harnesses its own stylesheets, templates, controllers, routes, services, and specs. This encapsulation allows us the comfort of isolation and structural locality. Here's how it looks:
+```
+client
+⋅⋅app/
+⋅⋅⋅⋅app.js * app entry file
+⋅⋅⋅⋅app.html * app template
+⋅⋅⋅⋅common/ * functionality pertinent to several components propagate into this directory
+⋅⋅⋅⋅components/ * where components live
+⋅⋅⋅⋅⋅⋅components.js * components entry file
+⋅⋅⋅⋅⋅⋅home/ * home component
+⋅⋅⋅⋅⋅⋅⋅⋅home.js * home entry file (routes, configurations, and declarations occur here)
+⋅⋅⋅⋅⋅⋅⋅⋅home.component.js * home "directive"
+⋅⋅⋅⋅⋅⋅⋅⋅home.controller.js * home controller
+⋅⋅⋅⋅⋅⋅⋅⋅home.styl * home styles
+⋅⋅⋅⋅⋅⋅⋅⋅home.html * home template
+⋅⋅⋅⋅⋅⋅⋅⋅home.spec.js * home specs (for entry, component, and controller)
+```
+
+## Testing Setup
+All tests are also written in ES6. We use Webpack to take care of the logistics of getting those files to run in the various browsers, just like with our client files. This is our testing stack:
+* Karma
+* Webpack + Babel
+* Mocha
+* Chai
+
+To run tests, type `npm test` or `karma start` in the terminal. Read more about testing [below](#testing).
+
+# Getting Started
+## Dependencies
+Tools needed to run this app:
+* `node` and `npm`
+Once you have these, install the following as globals:
+`npm install -g gulp karma karma-cli webpack`
+
+## Installing
+* `fork` this repo
+* `clone` your fork
+* `npm install -g gulp karma karma-cli webpack` install global cli dependencies
+* `npm install` to install dependencies
+
+## Running the App
+NG6 uses Gulp to build and launch the development environment. After you have installed all dependencies, you may run the app. Running `gulp` will bundle the app with `webpack`, launch a development server, and watch all files. The port will be displayed in the terminal.
+
+### Gulp Tasks
+Here's a list of available tasks:
+* `webpack`
+ * runs Webpack, which will transpile, concatenate, and compress (collectively, "bundle") all assets and modules into `dist/bundle.js`. It also prepares `index.html` to be used as application entry point, links assets and created dist version of our application.
+* `serve`
+ * starts a dev server via `webpack-dev-server`, serving the client folder.
+* `watch`
+ * alias of `serve`
+* `default` (which is the default task that runs when typing `gulp` without providing an argument)
+ * runs `serve`.
+* `component`
+ * scaffolds a new Angular component. [Read below](#generating-components) for usage details.
+
+### Testing
+To run the tests, run `npm test` or `karma start`.
+
+`Karma` combined with Webpack runs all files matching `*.spec.js` inside the `app` folder. This allows us to keep test files local to the component--which keeps us in good faith with continuing to build our app modularly. The file `spec.bundle.js` is the bundle file for **all** our spec files that Karma will run.
+
+Be sure to define your `*.spec.js` files within their corresponding component directory. You must name the spec file like so, `[name].spec.js`. If you don't want to use the `.spec.js` suffix, you must change the `regex` in `spec.bundle.js` to look for whatever file(s) you want.
+`Mocha` is the testing suite and `Chai` is the assertion library. If you would like to change this, see `karma.conf.js`.
+
+### Examples
+
+It's always easier to learn something if you have an examples. Here is a list of repos which based on this starter:
+
+ - [TodoMVC Example App](https://github.com/AngularClass/NG6-todomvc-starter)
+
+### Generating Components
+Following a consistent directory structure between components offers us the certainty of predictability. We can take advantage of this certainty by creating a gulp task to automate the "instantiation" of our components. The component boilerplate task generates this:
+```
+⋅⋅⋅⋅⋅⋅componentName/
+⋅⋅⋅⋅⋅⋅⋅⋅componentName.js // entry file where all its dependencies load
+⋅⋅⋅⋅⋅⋅⋅⋅componentName.component.js
+⋅⋅⋅⋅⋅⋅⋅⋅componentName.controller.js
+⋅⋅⋅⋅⋅⋅⋅⋅componentName.html
+⋅⋅⋅⋅⋅⋅⋅⋅componentName.styl // scoped to affect only its own template
+⋅⋅⋅⋅⋅⋅⋅⋅componentName.spec.js // contains passing demonstration tests
+```
+
+You may, of course, create these files manually, every time a new module is needed, but that gets quickly tedious.
+To generate a component, run `gulp component --name componentName`.
+
+The parameter following the `--name` flag is the name of the component to be created. Ensure that it is unique or it will overwrite the preexisting identically-named component.
+
+The component will be created, by default, inside `client/app/components`. To change this, apply the `--parent` flag, followed by a path relative to `client/app/components/`.
+
+For example, running `gulp component --name signup --parent auth` will create a `signup` component at `client/app/components/auth/signup`.
+
+Running `gulp component --name footer --parent ../common` creates a `footer` component at `client/app/common/footer`.
+
+Because the argument to `--name` applies to the folder name **and** the actual component name, make sure to camelcase the component names.
+
+# Starter Kit Support and Questions
+> Contact us, anytime, regarding anything about this project.
+
+* [Gitter: angularclass/NG6-starter](https://gitter.im/angularclass/NG6-starter)
+* [Twitter: @AngularClass](https://twitter.com/AngularClass)
+
+___
+
+enjoy — **AngularClass**
+
+
+
+[](https://angularclass.com)
+##[AngularClass](https://angularclass.com)
+> Learn AngularJS, Angular 2, and Modern Web Development from the best.
+> Looking for corporate Angular training, want to host us, or Angular consulting? hello@angularclass.com
diff --git a/client/app/app.component.js b/client/app/app.component.js
new file mode 100644
index 0000000..790cbc4
--- /dev/null
+++ b/client/app/app.component.js
@@ -0,0 +1,8 @@
+import template from './app.html';
+
+let appComponent = {
+ template,
+ restrict: 'E'
+};
+
+export default appComponent;
diff --git a/client/app/app.html b/client/app/app.html
new file mode 100644
index 0000000..f284be1
--- /dev/null
+++ b/client/app/app.html
@@ -0,0 +1,4 @@
+
+
diff --git a/client/app/app.js b/client/app/app.js
new file mode 100644
index 0000000..078c1ec
--- /dev/null
+++ b/client/app/app.js
@@ -0,0 +1,22 @@
+import angular from 'angular';
+import uiRouter from 'angular-ui-router';
+import AppComponent from './app.component';
+import pagesModule from '../pages/pages';
+import componentsModule from '../components/components';
+
+angular.module('app', [
+ componentsModule,
+ pagesModule,
+ uiRouter
+ ])
+ .config(($locationProvider, $stateProvider, $urlRouterProvider) => {
+ "ngInject";
+ $stateProvider.state('app', {
+ url: '',
+ component: 'app'
+ });
+ $urlRouterProvider.otherwise('/home');
+ $locationProvider.html5Mode(true).hashPrefix('!');
+ })
+
+ .component('app', AppComponent);
diff --git a/client/components/components.js b/client/components/components.js
new file mode 100644
index 0000000..b5b2d2f
--- /dev/null
+++ b/client/components/components.js
@@ -0,0 +1,5 @@
+import angular from 'angular';
+
+let componentsModule = angular.module('components', []).name;
+
+export default componentsModule;
\ No newline at end of file
diff --git a/client/index.html b/client/index.html
new file mode 100644
index 0000000..8ee5ea7
--- /dev/null
+++ b/client/index.html
@@ -0,0 +1,20 @@
+
+
+
+
+ Currency
+
+
+
+
+
+
+
+
+
+
+ Loading...
+
+
+
+
diff --git a/client/pages/home/home.component.js b/client/pages/home/home.component.js
new file mode 100644
index 0000000..90e3669
--- /dev/null
+++ b/client/pages/home/home.component.js
@@ -0,0 +1,7 @@
+import template from './home.html'
+
+let homeComponent = {
+ template
+};
+
+export default homeComponent;
\ No newline at end of file
diff --git a/client/pages/home/home.config.js b/client/pages/home/home.config.js
new file mode 100644
index 0000000..5c652f2
--- /dev/null
+++ b/client/pages/home/home.config.js
@@ -0,0 +1,8 @@
+export default ($stateProvider) => {
+ "ngInject";
+ $stateProvider
+ .state('app.home', {
+ url: '/home',
+ component: 'home',
+ });
+};
\ No newline at end of file
diff --git a/client/pages/home/home.html b/client/pages/home/home.html
new file mode 100644
index 0000000..fd85457
--- /dev/null
+++ b/client/pages/home/home.html
@@ -0,0 +1,3 @@
+
+
Hello world!
+
\ No newline at end of file
diff --git a/client/pages/home/home.js b/client/pages/home/home.js
new file mode 100644
index 0000000..bd7d1b1
--- /dev/null
+++ b/client/pages/home/home.js
@@ -0,0 +1,12 @@
+import angular from 'angular';
+import uiRouter from 'angular-ui-router';
+import homeComponent from './home.component';
+import homeConfig from './home.config';
+
+let homeModule = angular.module('pages.home', [
+ uiRouter
+]).component('home', homeComponent)
+.config(homeConfig)
+.name;
+
+export default homeModule;
\ No newline at end of file
diff --git a/client/pages/pages.js b/client/pages/pages.js
new file mode 100644
index 0000000..844526b
--- /dev/null
+++ b/client/pages/pages.js
@@ -0,0 +1,8 @@
+import angular from 'angular';
+import homeModule from './home/home';
+
+let pagesModule = angular.module('pages', [
+ homeModule
+]).name;
+
+export default pagesModule;
\ No newline at end of file
diff --git a/generator/component/temp.component.js b/generator/component/temp.component.js
new file mode 100644
index 0000000..0e38287
--- /dev/null
+++ b/generator/component/temp.component.js
@@ -0,0 +1,12 @@
+import template from './<%= name %>.html';
+import controller from './<%= name %>.controller';
+import './<%= name %>.styl';
+
+let <%= name %>Component = {
+ restrict: 'E',
+ bindings: {},
+ template,
+ controller
+};
+
+export default <%= name %>Component;
diff --git a/generator/component/temp.controller.js b/generator/component/temp.controller.js
new file mode 100644
index 0000000..5a46c17
--- /dev/null
+++ b/generator/component/temp.controller.js
@@ -0,0 +1,7 @@
+class <%= upCaseName %>Controller {
+ constructor() {
+ this.name = '<%= name %>';
+ }
+}
+
+export default <%= upCaseName %>Controller;
diff --git a/generator/component/temp.html b/generator/component/temp.html
new file mode 100644
index 0000000..38bbb2a
--- /dev/null
+++ b/generator/component/temp.html
@@ -0,0 +1,3 @@
+
+
{{ $ctrl.name }}
+
diff --git a/generator/component/temp.js b/generator/component/temp.js
new file mode 100644
index 0000000..7df4c04
--- /dev/null
+++ b/generator/component/temp.js
@@ -0,0 +1,13 @@
+import angular from 'angular';
+import uiRouter from 'angular-ui-router';
+import <%= name %>Component from './<%= name %>.component';
+
+let <%= name %>Module = angular.module('<%= name %>', [
+ uiRouter
+])
+
+.component('<%= name %>', <%= name %>Component)
+
+.name;
+
+export default <%= name %>Module;
diff --git a/generator/component/temp.spec.js b/generator/component/temp.spec.js
new file mode 100644
index 0000000..57030f8
--- /dev/null
+++ b/generator/component/temp.spec.js
@@ -0,0 +1,49 @@
+import <%= upCaseName %>Module from './<%= name %>'
+import <%= upCaseName %>Controller from './<%= name %>.controller';
+import <%= upCaseName %>Component from './<%= name %>.component';
+import <%= upCaseName %>Template from './<%= name %>.html';
+
+describe('<%= upCaseName %>', () => {
+ let $rootScope, makeController;
+
+ beforeEach(window.module(<%= upCaseName %>Module));
+ beforeEach(inject((_$rootScope_) => {
+ $rootScope = _$rootScope_;
+ makeController = () => {
+ return new <%= upCaseName %>Controller();
+ };
+ }));
+
+ describe('Module', () => {
+ // top-level specs: i.e., routes, injection, naming
+ });
+
+ describe('Controller', () => {
+ // controller specs
+ it('has a name property [REMOVE]', () => { // erase if removing this.name from the controller
+ let controller = makeController();
+ expect(controller).to.have.property('name');
+ });
+ });
+
+ describe('Template', () => {
+ // template specs
+ // tip: use regex to ensure correct bindings are used e.g., {{ }}
+ it('has name in template [REMOVE]', () => {
+ expect(<%= upCaseName %>Template).to.match(/{{\s?\$ctrl\.name\s?}}/g);
+ });
+ });
+
+ describe('Component', () => {
+ // component/directive specs
+ let component = <%= upCaseName %>Component;
+
+ it('includes the intended template',() => {
+ expect(component.template).to.equal(<%= upCaseName %>Template);
+ });
+
+ it('invokes the right controller', () => {
+ expect(component.controller).to.equal(<%= upCaseName %>Controller);
+ });
+ });
+});
diff --git a/generator/component/temp.styl b/generator/component/temp.styl
new file mode 100644
index 0000000..47addd6
--- /dev/null
+++ b/generator/component/temp.styl
@@ -0,0 +1,2 @@
+.<%= name %>
+ color red
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
new file mode 100644
index 0000000..db91cad
--- /dev/null
+++ b/gulpfile.babel.js
@@ -0,0 +1,126 @@
+'use strict';
+
+import gulp from 'gulp';
+import webpack from 'webpack';
+import path from 'path';
+import sync from 'run-sequence';
+import rename from 'gulp-rename';
+import template from 'gulp-template';
+import fs from 'fs';
+import yargs from 'yargs';
+import lodash from 'lodash';
+import gutil from 'gulp-util';
+import serve from 'browser-sync';
+import del from 'del';
+import webpackDevMiddleware from 'webpack-dev-middleware';
+import webpackHotMiddleware from 'webpack-hot-middleware';
+import colorsSupported from 'supports-color';
+import historyApiFallback from 'connect-history-api-fallback';
+
+let root = 'client';
+
+// helper method for resolving paths
+let resolveToApp = (glob = '') => {
+ return path.join(root, 'app', glob); // app/{glob}
+};
+
+let resolveToComponents = (glob = '') => {
+ return path.join(root, 'app/components', glob); // app/components/{glob}
+};
+
+// map of all paths
+let paths = {
+ js: resolveToComponents('**/*!(.spec.js).js'), // exclude spec files
+ styl: resolveToApp('**/*.styl'), // stylesheets
+ html: [
+ resolveToApp('**/*.html'),
+ path.join(root, 'index.html')
+ ],
+ entry: [
+ 'babel-polyfill',
+ path.join(__dirname, root, 'app/app.js')
+ ],
+ output: root,
+ blankTemplates: path.join(__dirname, 'generator', 'component/**/*.**'),
+ dest: path.join(__dirname, 'dist')
+};
+
+// use webpack.config.js to build modules
+gulp.task('webpack', ['clean'], (cb) => {
+ const config = require('./webpack.dist.config');
+ config.entry.app = paths.entry;
+
+ webpack(config, (err, stats) => {
+ if(err) {
+ throw new gutil.PluginError("webpack", err);
+ }
+
+ gutil.log("[webpack]", stats.toString({
+ colors: colorsSupported,
+ chunks: false,
+ errorDetails: true
+ }));
+
+ cb();
+ });
+});
+
+gulp.task('serve', () => {
+ const config = require('./webpack.dev.config');
+ config.entry.app = [
+ // this modules required to make HRM working
+ // it responsible for all this webpack magic
+ 'webpack-hot-middleware/client?reload=true',
+ // application entry point
+ ].concat(paths.entry);
+
+ var compiler = webpack(config);
+
+ serve({
+ port: process.env.PORT || 3000,
+ open: false,
+ server: {baseDir: root},
+ middleware: [
+ historyApiFallback(),
+ webpackDevMiddleware(compiler, {
+ stats: {
+ colors: colorsSupported,
+ chunks: false,
+ modules: false
+ },
+ publicPath: config.output.publicPath
+ }),
+ webpackHotMiddleware(compiler)
+ ]
+ });
+});
+
+gulp.task('watch', ['serve']);
+
+gulp.task('component', () => {
+ const cap = (val) => {
+ return val.charAt(0).toUpperCase() + val.slice(1);
+ };
+ const name = yargs.argv.name;
+ const parentPath = yargs.argv.parent || '';
+ const destPath = path.join(resolveToComponents(), parentPath, name);
+
+ return gulp.src(paths.blankTemplates)
+ .pipe(template({
+ name: name,
+ upCaseName: cap(name)
+ }))
+ .pipe(rename((path) => {
+ path.basename = path.basename.replace('temp', name);
+ }))
+ .pipe(gulp.dest(destPath));
+});
+
+gulp.task('clean', (cb) => {
+ del([paths.dest]).then(function (paths) {
+ gutil.log("[clean]", paths);
+ cb();
+ })
+});
+
+gulp.task('default', ['watch']);
diff --git a/karma.conf.js b/karma.conf.js
new file mode 100644
index 0000000..f40c1c6
--- /dev/null
+++ b/karma.conf.js
@@ -0,0 +1,68 @@
+module.exports = function (config) {
+ config.set({
+ // base path used to resolve all patterns
+ basePath: '',
+
+ // frameworks to use
+ // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
+ frameworks: ['mocha', 'chai'],
+
+ // list of files/patterns to load in the browser
+ files: [{ pattern: 'spec.bundle.js', watched: false }],
+
+ // files to exclude
+ exclude: [],
+
+ plugins: [
+ require("karma-chai"),
+ require("karma-chrome-launcher"),
+ require("karma-mocha"),
+ require("karma-mocha-reporter"),
+ require("karma-sourcemap-loader"),
+ require("karma-webpack")
+ ],
+
+ // preprocess matching files before serving them to the browser
+ // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
+ preprocessors: { 'spec.bundle.js': ['webpack', 'sourcemap'] },
+
+ webpack: {
+ devtool: 'inline-source-map',
+ module: {
+ loaders: [
+ { test: /\.js/, exclude: [/app\/lib/, /node_modules/], loader: 'babel' },
+ { test: /\.html/, loader: 'raw' },
+ { test: /\.styl$/, loader: 'style!css!stylus' },
+ { test: /\.css$/, loader: 'style!css' }
+ ]
+ }
+ },
+
+ webpackServer: {
+ noInfo: true // prevent console spamming when running in Karma!
+ },
+
+ // available reporters: https://npmjs.org/browse/keyword/karma-reporter
+ reporters: ['mocha'],
+
+ // web server port
+ port: 9876,
+
+ // enable colors in the output
+ colors: true,
+
+ // level of logging
+ // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+ logLevel: config.LOG_INFO,
+
+ // toggle whether to watch files and rerun tests upon incurring changes
+ autoWatch: false,
+
+ // start these browsers
+ // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+ browsers: ['Chrome'],
+
+ // if true, Karma runs tests once and exits
+ singleRun: true
+ });
+};
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..13059b9
--- /dev/null
+++ b/package.json
@@ -0,0 +1,68 @@
+{
+ "name": "ng6-starter",
+ "version": "0.0.1",
+ "description": "Starter for Angular + ES6 + (Webpack or JSPM)",
+ "main": "index.js",
+ "dependencies": {
+ "angular": "~1.5.0",
+ "angular-ui-router": "^1.0.0-beta.1",
+ "normalize.css": "^3.0.3"
+ },
+ "devDependencies": {
+ "angular-mocks": "^1.5.0",
+ "babel-core": "^6.7.7",
+ "babel-loader": "^6.2.4",
+ "babel-polyfill": "^6.7.4",
+ "babel-plugin-transform-runtime": "^6.7.5",
+ "babel-preset-es2015": "^6.6.0",
+ "babel-preset-stage-0": "^6.5.0",
+ "babel-register": "^6.7.2",
+ "babel-runtime": "^6.6.1",
+ "browser-sync": "^2.11.1",
+ "chai": "^3.4.0",
+ "connect-history-api-fallback": "^1.1.0",
+ "css-loader": "^0.19.0",
+ "del": "^2.2.0",
+ "fs-walk": "0.0.1",
+ "gulp": "^3.9.0",
+ "gulp-rename": "^1.2.2",
+ "gulp-template": "^3.0.0",
+ "gulp-util": "^3.0.7",
+ "html-webpack-plugin": "^1.7.0",
+ "karma": "^0.13.9",
+ "karma-chai": "^0.1.0",
+ "karma-chrome-launcher": "^0.2.0",
+ "karma-mocha": "^0.2.0",
+ "karma-mocha-reporter": "^1.0.2",
+ "karma-sourcemap-loader": "^0.3.4",
+ "karma-webpack": "^1.5.1",
+ "lodash": "^4.11.1",
+ "mocha": "^2.3.0",
+ "ng-annotate-loader": "0.0.10",
+ "node-libs-browser": "^0.5.0",
+ "raw-loader": "^0.5.1",
+ "run-sequence": "^1.1.0",
+ "style-loader": "^0.12.2",
+ "stylus": "^0.54.5",
+ "stylus-loader": "^2.1.1",
+ "supports-color": "^3.1.2",
+ "webpack": "^1.9.5",
+ "webpack-dev-middleware": "^1.6.1",
+ "webpack-hot-middleware": "^2.6.0",
+ "yargs": "^3.9.0"
+ },
+ "scripts": {
+ "test": "karma start"
+ },
+ "keywords": [
+ "angular",
+ "webpack",
+ "es6"
+ ],
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/orbb1/currency.git"
+ },
+ "author": "AngularClass",
+ "license": "Apache-2.0"
+}
diff --git a/spec.bundle.js b/spec.bundle.js
new file mode 100644
index 0000000..d48dc0c
--- /dev/null
+++ b/spec.bundle.js
@@ -0,0 +1,27 @@
+/*
+ * When testing with Webpack and ES6, we have to do some
+ * preliminary setup. Because we are writing our tests also in ES6,
+ * we must transpile those as well, which is handled inside
+ * `karma.conf.js` via the `karma-webpack` plugin. This is the entry
+ * file for the Webpack tests. Similarly to how Webpack creates a
+ * `bundle.js` file for the compressed app source files, when we
+ * run our tests, Webpack, likewise, compiles and bundles those tests here.
+*/
+
+import angular from 'angular';
+
+// Built by the core Angular team for mocking dependencies
+import mocks from 'angular-mocks';
+
+// We use the context method on `require` which Webpack created
+// in order to signify which files we actually want to require or import.
+// Below, `context` will be a/an function/object with file names as keys.
+// Using that regex, we scan within `client/app` and target
+// all files ending with `.spec.js` and trace its path.
+// By passing in true, we permit this process to occur recursively.
+let context = require.context('./client/app', true, /\.spec\.js/);
+
+// Get all files, for each file, call the context function
+// that will require the file and load it here. Context will
+// loop and require those spec files here.
+context.keys().forEach(context);
diff --git a/webpack.config.js b/webpack.config.js
new file mode 100644
index 0000000..acf5e5e
--- /dev/null
+++ b/webpack.config.js
@@ -0,0 +1,35 @@
+var path = require('path');
+var webpack = require('webpack');
+var HtmlWebpackPlugin = require('html-webpack-plugin');
+
+module.exports = {
+ devtool: 'source-map',
+ entry: {},
+ module: {
+ loaders: [
+ { test: /\.js$/, exclude: [/app\/lib/, /node_modules/], loader: 'ng-annotate!babel' },
+ { test: /\.html$/, loader: 'raw' },
+ { test: /\.styl$/, loader: 'style!css!stylus' },
+ { test: /\.css$/, loader: 'style!css' }
+ ]
+ },
+ plugins: [
+ // Injects bundles in your index.html instead of wiring all manually.
+ // It also adds hash to all injected assets so we don't have problems
+ // with cache purging during deployment.
+ new HtmlWebpackPlugin({
+ template: 'client/index.html',
+ inject: 'body',
+ hash: true
+ }),
+
+ // Automatically move all modules defined outside of application directory to vendor bundle.
+ // If you are using more complicated project structure, consider to specify common chunks manually.
+ new webpack.optimize.CommonsChunkPlugin({
+ name: 'vendor',
+ minChunks: function (module, count) {
+ return module.resource && module.resource.indexOf(path.resolve(__dirname, 'client')) === -1;
+ }
+ })
+ ]
+};
diff --git a/webpack.dev.config.js b/webpack.dev.config.js
new file mode 100644
index 0000000..0ba0433
--- /dev/null
+++ b/webpack.dev.config.js
@@ -0,0 +1,19 @@
+var webpack = require('webpack');
+var path = require('path');
+var config = require('./webpack.config');
+
+config.output = {
+ filename: '[name].bundle.js',
+ publicPath: '/',
+ path: path.resolve(__dirname, 'client')
+};
+
+config.plugins = config.plugins.concat([
+
+ // Adds webpack HMR support. It act's like livereload,
+ // reloading page after webpack rebuilt modules.
+ // It also updates stylesheets and inline assets without page reloading.
+ new webpack.HotModuleReplacementPlugin()
+]);
+
+module.exports = config;
diff --git a/webpack.dist.config.js b/webpack.dist.config.js
new file mode 100644
index 0000000..3f36a34
--- /dev/null
+++ b/webpack.dist.config.js
@@ -0,0 +1,26 @@
+var webpack = require('webpack');
+var path = require('path');
+var config = require('./webpack.config');
+
+config.output = {
+ filename: '[name].bundle.js',
+ publicPath: '',
+ path: path.resolve(__dirname, 'dist')
+};
+
+config.plugins = config.plugins.concat([
+
+ // Reduces bundles total size
+ new webpack.optimize.UglifyJsPlugin({
+ mangle: {
+
+ // You can specify all variables that should not be mangled.
+ // For example if your vendor dependency doesn't use modules
+ // and relies on global variables. Most of angular modules relies on
+ // angular global variable, so we should keep it unchanged
+ except: ['$super', '$', 'exports', 'require', 'angular']
+ }
+ })
+]);
+
+module.exports = config;