I'm a Javascript and Nodejs newb and I'm not sure how to best organize things. I'm writing a web interface for a C++ application by using Nodejs and V8 convert to wrap a C++ API. The question I have is, is there some way I can use Express to serve HTML that has references to functions/global inside nodejs? Or do I have to resort to having a bunch of res.write(html) types of calls in the HTML in order to do that?
For example, I want to prefill form data with stuff that's accessed from a C++ configuration API. The C++ API is wrapped in a Nodejs module. Right now anything that needs to be dynamically generated (like prefilled forms) I just do something like,
var novaconfig = require('./NodeAppConfig/build/Release/appconfig');
var AppConfiguration = new Appconfig.AppConfigBinding();
var express=require('express');
var app = express.createServer(express_options);
app.configure(function () {
app.use(express.methodOverride());
app.use(express.bodyParser());
app.use(app.router);
});
app.get('/configureApplication.html', function(req, res) {
console.log("[200] " + req.method + " to " + req.url);
res.writeHead(200, "OK", {'Content-Type': 'text/html'});
res.write('<HTML>');
res.write('<HEAD>');
res.write(' <link rel="stylesheet" type="text/css" href="configstyle.css" media="screen">');
res.write('</HEAD>');
res.write('<BODY>');
res.write('<label>');
res.write(Interface);
res.write('</label>');
res.write('<form method="post" action="/configureNovaSave">');
res.write('<input type="text" name="interface" value="');
res.write(AppConfiguration.GetCurrentInterface());
res.write('" /><br />');
res.write('<input type="submit" name="submitbutton" id="submitbutton" value="Save Settings" />');
res.write('</form>');
res.write("<br/>");
res.write('</BODY>');
res.write('</HTML>');
res.end();
});
But this is obviously a bad way to do it. Is there a way to have the dynamically generated HTML in a stand alone file and then still access AppConfiguration.GetCurrentInterface() within it? What's a good way to organize the files for something like this?
I think what you want is a template engine. Maybe take a look at Jade or Mustache. Then you just pass in the parts you want to be dynamic and the engine renders the page for you.
The code would look something like the following
app.get('/configureApplication.html', function(req, res) {
var config = AppConfiguration.GetCurrentInterface();
res.render('configureApplication.jade', {locals: {config: config}});
});
configureApplication.jade can access the variable 'config' as follows
doctype 5
html(lang="en")
head
title= config
Full documentation here