title: AngularJS - getting "Uncaught Error: [$injector:modulerr]" message on a simple app
body: <p>I'm following along with Linkster's online tutorial that shows how to make a reddit clone using the MEAN stack. (<a href="https://thinkster.io/mean-stack-tutorial#angular-routing" rel="nofollow">https://thinkster.io/mean-stack-tutorial#angular-routing</a>)</p>
  
  <p>I've gotten to a point where I've tried everything, but nothing seems to be working. Any ideas what's wrong? Any help/ideas are appreciated :)</p>
  
  <p>-----index.html----------------</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Welcome to FlapperNews!&lt;/title&gt;
      &lt;link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.min.js"&gt;&lt;/script&gt;
  
      &lt;script src="app.js"&gt;&lt;/script&gt;
      &lt;style&gt; .glyphicon-thumbs-up { cursor:pointer } &lt;/style&gt;
  &lt;/head&gt;
  &lt;body ng-app="flapperNews" ng-controller="MainCtrl"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-md-6 col-md-offset-3"&gt;
              &lt;ui-view&gt;&lt;/ui-view&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;script type="text/ng-template" id="/home.html"&gt;
          &lt;div class="page-header"&gt;
                  &lt;h1&gt;FlapperNews&lt;/h1&gt;
          &lt;/div&gt;
              &lt;div ng-repeat="post in posts | orderBy: '-upvotes'"&gt;
                  &lt;span class="glyphicon glyphicon-thumbs-up" ng-click="incrementUpvotes(post)"&gt;&lt;/span&gt;
                   &lt;span style="font-size:20px; margin-left:10px;"&gt;
                  &lt;a ng-show="post.link" href="{{post.link}}"&gt;
                      {{post.title}}
                  &lt;/a&gt;
                  &lt;span ng-hide="post.link"&gt;
                      {{post.title}}
                  &lt;/span&gt;
                  -upvotes: {{post.upvotes}}
              &lt;/div&gt;
              &lt;form ng-submit="addPost()"
              style="margin-top:30px;"&gt;
                  &lt;h3&gt;Add a new post&lt;/h3&gt;  
  
                  &lt;div class="form-group"&gt;
                      &lt;input type="text" class="form-control" placeholder="title" ng-model="title"&gt;&lt;/input&gt;
                  &lt;/div&gt;
                  &lt;div class="form-group"&gt;
                      &lt;input type="text" class="form-control" placeholder="Link" ng-model="link"&gt;&lt;/input&gt;
                  &lt;/div&gt;
                  &lt;button type="submit" class="btn btn-primary"&gt;Post&lt;/button&gt;
              &lt;/form&gt;
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>----app.js----------------</p>
  
  <pre><code>var app = angular.module('flapperNews', ['ui-router']);
  app.config([
  '$stateProvider',
  '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider){
  
  $stateProvider
    .state ('home', {
      url: "/home",
      templateUrl: "/home.html",
      controller: 'MainCtrl'
    });
  
    // .state('posts', {
    //   url: '/posts/{id}',
    //   templateUrl: '/posts.html',
    //   controller: 'PostsCtrl'
    // }); 
  
    $urlRouterProvider.otherwise('home');
    }])
  
  app.factory('posts', [function(){
    var o = {
      posts: [{title: 'hello post1', link: '', upvotes: 0 }]
    };
    return o;
  }])
  
  app.controller('MainCtrl', [
  '$scope',
  'posts',
  function($scope, posts){
    $scope.test = 'Hello world!';
  
    $scope.posts = posts.posts;
  
   $scope.addPost = function(){
          if(!$scope.title || $scope.title === '') { return; }
          $scope.posts.push({
        title: $scope.title,
        link: $scope.link,
        upvotes: 0});
      $scope.title = '';
      $scope.link = '';
    }
  
    $scope.incrementUpvotes = function(post) {
       post.upvotes += 1;
    }
  }]);
  </code></pre>