¿Cómo alojar una aplicación AngularJS en Heroku usando Node.js SIN usar yeoman?

Question

Nov 22, 2014, 06:01 AM

angularjs heroku express angularjs-ng-route node.js

¿Cómo alojar una aplicación AngularJS en Heroku usando Node.js SIN usar yeoman?

Estoy tratando de impulsar una compilación Hello World con AngularJS en Heroku usando Node.js. PERO con múltiples vistas (parciales).

Primero implementé Hello World sin usar ngRoute, lo que significa: sin parciales. Eso estuvo bien y suave. Entonces, traté de empujar 2 parciales simples. Pero creo que el problema es alojar la aplicación y al mismo tiempo pedir parciales. Sé que no es el enfoque correcto y quiero su consejo.

Este es mi index.html:

<!DOCTYPE html>
<html ng-app="main">
<head>
    <meta name="name" content="something">
    <title></title>
</head>
<body>
    <section ng-view=""></section>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular-route.min.js" type="text/javascript" charset="utf-8"></script>

    <script type="text/javascript" charset="utf-8">
    angular.module('main', ['ngRoute'])
    .config(['$routeProvider', '$http', function ($routeProvider, $http){
        console.log('hola');
        $routeProvider
        .when('/', {
            resolve: **??? I tried with templateUrl but did not work either**
            ,controller: 'indexCtrl'
        })
        .when('/second', {
            resolve: **???**
            ,controller: 'secondCtrl'
        })
        .otherwise({
            redirectTo: '/'
        });
    }])
    .controller('indexCtrl', ['$scope', function ($scope){
        $scope.helloWorld = "Hello World";
    }])
    .controller('secondCtrl', ['$scope', function ($scope){
        $scope.helloWorld = "World Hello";
    }]);
    </script>
</body>
</html>

Parcial 'templates / second.html'

<h1>{{ helloWorld }}<h1>
<a href="#/" title="">Go to First</a>

Parcial 'templates / index.html'

<h1>{{ helloWorld }}<h1>
<a href="#/second" title="">Go to Second</a>

Mi aplicación express:

var express = require('express'),
app = express();
app.set('view engine', 'html');
app.get('/', function(req, res) {
    res.sendfile('index.html', {root: __dirname })
});
app.get('/index', function (req, res){
    res.sendfile('templates/index.html', {root: __dirname })
});
app.get('/second', function (req, res){
    res.sendfile('templates/second.html', {root: __dirname })
});
var server = app.listen(process.env.PORT || 80);

Y obviamente, Procfile:

web: node index.js

Todos los tutoriales que he encontrado hasta ahora usan Yeoman pero no quiero usar Yeoman ni ninguna otra herramienta de andamiaje (si eso es lo que es).

P: ¿Es posible alojar una aplicación AngularJS en la misma aplicación Heroku donde estoy almacenando los parciales? Si es así, ¿qué estoy haciendo mal? Si no, ¿cuál es el mejor enfoque?