title: Understanding what it takes to remove the hash # from angular routes
body: <p>Before removing the hash sign, I had</p>
  
  <pre><code>mainApp.config(function ($locationProvider, $routeProvider) {
      $routeProvider
      .when('/page', {
          controller: 'Page',
          templateUrl: 'templates/page.html'
      })
      .when('/main', {
          controller: 'Main',
          templateUrl: 'templates/main.html'
      })
      .otherwise({ redirectTo: '/main'});
  
      //$locationProvider.html5Mode(true);
  });
  </code></pre>
  
  <p>and these worked fine</p>
  
  <pre><code>http://localhost:8080/index.html#/main
  http://localhost:8080/index.html#/page
  </code></pre>
  
  <p>After removing the pound sign, I added to index.html</p>
  
  <pre><code>&lt;base href="/"&gt;
  </code></pre>
  
  
  
  <pre><code>&lt;script src="/vendor/bootstrap-dist/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script src="/vendor/javascript/angular/angular.js"&gt;&lt;/script&gt;
  &lt;script src="/vendor/javascript/angular/angular-route.js"&gt;&lt;/script&gt;
  &lt;script src="/vendor/javascript/angular/ui-bootstrap-tpls-0.11.2.min.js"&gt;&lt;/script&gt;
  &lt;script src="/javascript/index.js"&gt;&lt;/script&gt;
  &lt;script src="/javascript/controllers/main.js"&gt;&lt;/script&gt;
  &lt;script src="/javascript/controllers/page.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>and to index.js</p>
  
  <pre><code>$locationProvider.html5Mode(true);
  </code></pre>
  
  <p>now hitting <code>http://localhost:8080</code> redirects to <code>http://localhost:8080/main</code></p>
  
  <p>but going to <code>http://localhost:8080/main</code> directly in the browser returns 404 and the other pages too</p>
  
  <p>What should I do to fix the problem?</p>
  
  <p>my backend is java</p>