Added boilerplate for components, services, and directives

Author: nearbycoder

src/app/components/home/capitilize.directive.js

@@ -0,0 +1,15 @@
+export default class esCapitilize {
+  construtor () {
+    return {
+      restrict: 'A'
+    };
+  }
+
+  link (scope, element) {
+    element.html(toTitleCase(element.html()));
+  }
+}
+
+function toTitleCase (str) {
+  return str.replace(/\w\S*/g, function (txt) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); });
+};

src/app/components/home/counter.component.js

@@ -0,0 +1,15 @@
+import templateUrl from 'home/counter.html';
+
+class controller {
+  constructor () {
+
+  }
+}
+
+export default {
+  controller,
+  templateUrl,
+  bindings: {
+    count: '<count'
+  }
+};

src/app/components/home/github.service.js

@@ -0,0 +1,18 @@
+export default class GitHubService {
+  constructor ($resource) {
+    'ngInject';
+    var githubService = $resource(
+      'https://api.github.com/users/',
+      {},
+      {
+        'getRepos': {
+          method: 'GET',
+          url: 'https://api.github.com/users/nearbycoder/repos',
+          isArray: true
+        }
+      }
+    );
+
+    return githubService;
+  }
+};

src/app/components/home/home.controller.js

@@ -1,6 +1,11 @@
 export default class HomeController {
-  constructor () {
+  constructor (githubService) {
     'ngInject';
+
+    githubService.getRepos().$promise.then(results => {
+      this.repos = results;
+      this.count = results.length;
+    });
   }
 
 }

src/app/components/home/index.js

@@ -3,8 +3,14 @@ import uirouter from 'angular-ui-router';
 import ngResource from 'angular-resource';
 import routing from './home.routes.js';
 import HomeController from './home.controller.js';
+import esCapitilize from './capitilize.directive.js';
+import esCounter from './counter.component.js';
+import GithubService from './github.service.js';
 
 export default angular.module('app.home', [uirouter, ngResource])
   .config(routing)
   .controller('HomeController', HomeController)
+  .directive('esCapitilize', () => new esCapitilize())
+  .component('esCounter', esCounter)
+  .service('githubService', GithubService)
   .name;

src/public/views/home/counter.html

@@ -0,0 +1,3 @@
+<div>
+  <span es-capitilize>The number of repos is</span> {{$ctrl.count}}
+</div>

src/public/views/home/home.html

@@ -1 +1,5 @@
-testing
+<es-counter count="$ctrl.count"></es-counter>
+
+<div ng-repeat="repo in $ctrl.repos">
+  <span>{{repo.name}}</span>
+</div>