0

I'm new to Express and I'm trying to convert this project

https://github.com/shawn-simon-developer/NodeAngularProxyhttps://github.com/shawn-simon-developer/NodeAngularProxy into one where I can use Jade. I've installed Jade via npm. My folder structure looks like this:

myProject
--app
----css (inside e.g. bootstrap)
----index.jade
----js
------controllers
------services
----libs
----templates
------main.jade
--index.js
--node_modules
----(tons of modules in here e.g.)
----jade
----sass
----express
--package.json

index.js looks like this:

/**
 * Module dependencies.
 */
var express = require('express');
var jade = require('jade');
var httpProxy = require('http-proxy');
var bodyParser = require('body-parser');

var apiForwardingUrl = 'http://api.open-notify.org/astros.json?';

// Solution for forwarding from http to https taken from:
// http://stackoverflow.com/questions/15801014/how-to-use-node-http-proxy-for-http-to-https-routing
var proxyOptions = {
    changeOrigin: true
};

httpProxy.prototype.onError = function (err) {
    console.log(err);
};

var apiProxy = httpProxy.createProxyServer(proxyOptions);

console.log('Forwarding API requests to ' + apiForwardingUrl);

// Node express server setup.
var server = express();
server.set('port', 3000);
server.use(express.static(__dirname + '/app'));

server.all("/space/*", function(req, res) {
    apiProxy.web(req, res, {target: apiForwardingUrl});
});

server.use(bodyParser.json());
server.use(bodyParser.urlencoded({
    extended: true
}));

// Start Server.
server.listen(server.get('port'), function() {
    console.log('Express server listening on port ' + server.get('port'));
});


server.set('view engine', 'jade'); // register the template engine

server.get('/templates/:name', function (req, res)
 { var name = req.params.name;
   res.render('templates/' + name);
});

And then index.jade like this

html
  head
    title Angular App
    // Angular Modules
    script(type='text/javascript', src='libs/angular/angular.js')
    script(type='text/javascript', src='libs/angular-route/angular-route.js')
    script(type='text/javascript', src='libs/jquery/jquery.js')
    // CSS Modules
    link(rel='stylesheet', type='text/css', href='css/bootstrap/bootstrap.min.css')
  body(ng-app='app')
    .container(ng-view='')
  // JS Modules
  script(type='text/javascript', src='js/app.js')
  script(type='text/javascript', src='js/controllers/MainCtrl.js')
  script(type='text/javascript', src='js/services/apiService.js')

and finally main.jade

{{ctrl.test}}

p {{ctrl.wikiData | json}}

h1 test

that's it. I can start the server using node index.js in the root of the project. however when I go to my localhost:3000 I get the Cannot GET / issue that many others also seem to have. However, since I'm new to Node and Express I haven't been able to generalise the answers on other questions and solve my own. Could anyone help me in what's going wrong here? thanks already!

EDIT 1: I have added

server.set('views', __dirname + '/app/templates');
server.get('/', function (req, res) { res.render('index', {}); }); 
server.get('/', function (req, res) {
     res.send('hello');
});

to the end of index.js and moved the index.jade file inside the templates folder. Now what I'm getting is a log to the console like this:

angular.js:10506 GET http://localhost:3000/templates/main 404 (Not Found)

That's one step further but not a solution yet

suMi
  • 1,536
  • 1
  • 17
  • 30

2 Answers2

0

you should not point to localhost. Instead point to localhost:3000

http://localhoat:3000

Answer to main question

I could not find the index router!! can u add index router like this.

server.get('/', function (req, res) {
     res.send('hello');
});

Answer to 2nd Edit

Remove templates from the parameter to res.render function.

server.get('/templates/:name', function (req, res){
    var name = req.params.name;
    res.render( name);
});
enRaiser
  • 2,606
  • 2
  • 21
  • 39
0

Try change file structure to

/public [rename app to www, static, pub]
    /css
    /js
    /libs
/node_modules
/templates [jade is server-side, so don't share it for browsers]
    /layout
        index.jade
    index.jade
    main.jade
index.js
package.json

And code like below

var express = require('express');
var jade = require('jade');
var server = express();
...
server.use(express.static(__dirname + '/public'));
server.set('view engine', 'jade'); 
server.set('views', __dirname + '/templates'); 
...
server.get('/', function (req, res) { 
    res.render('index', {}); 
});

server.get('/:page', function (req, res) { 
    res.render(req.params.name, {caption: 'Example', text: 'Hello world'}); 
});

In templates use layout e.g.

// templates/layout/index.jade
html
  head
    title Angular App
    script(...)
    link(...)
  body(ng-app='app')
    .container(ng-view='')
    block content

// templates/index.jade`
extends ./layout/index.jade
block content
  IndexPage

// templates/layout/main.jade`
extends ./layout/index.jade 
block content
  h1 {{caption}}
  {{text}}

P.S. Jade is server-side render engine, angular is client-side. Often one of them is enough.

Aikon Mogwai
  • 4,954
  • 2
  • 18
  • 31
  • tried that getting this error http://localhost:3000/templates/main Failed to load resource: the server responded with a status of 404 (Not Found) – suMi Aug 12 '16 at 11:27
  • Use `localhost:3000/main` instead. Or `server.get('/:page', function (req, res) {` change to `server.get('/templates/:page', function (req, res) {` (in route `/smth` is not path for non-static files). – Aikon Mogwai Aug 12 '16 at 11:36
  • tdid your second suggestion. Outcome 'Cannot GET /' – suMi Aug 12 '16 at 11:41
  • If you don't erase code `server.get('/', function (req, res) { ... });` then it's unbelievable. P.S. I don't have idea why you are want to use `/templates/...` in route. – Aikon Mogwai Aug 12 '16 at 11:45
  • ok. I missunderstood ur comment then. Now I get `Error: Failed to lookup view "undefined" in views directory "projecPath/templates"` from Terminal using templates in route was your suggestion, wasn't it? – suMi Aug 12 '16 at 11:50
  • Try remove `extends ./layout/index.jade` from `index.jade` and `main.jade`. If no errors appears then try change `./layout/index.jade` to likely e.g. `/layout/index.jade` or `layout/index.jade` or `extends ../layout/index.jade` – Aikon Mogwai Aug 12 '16 at 11:56
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/120798/discussion-between-sumi-and-aikon-mogwai). – suMi Aug 12 '16 at 12:01