I have a simple html page being served by express on a node.js server and in the client side javascript i want to access some server side variables. I tried googling around for a solution but didn't see a straight forward solution without using some sort of templating engine.
So if i need to access a variable on the server from a client side JS served from the same host, what do i need to do?
To access the variable on the client, you'll need to expose it inside of a script tag, there are a few node modules that can help you with it (ex: express-state) https://www.npmjs.com/package/express-state, but you'll need a templating engine to generate the html required for it. You can use a variety of templating engines when working with express. If you use express generators straight out of the box it should come with jade and you can use different options on the generators to use other templating engines. See here for express generator options http://expressjs.com/en/starter/generator.html
Create an API to expose your variable:
app.get('/myvar', function(req, res){
res.send(varYouWantToSend);
});
Then in the client-side make a call for that API with a http GET request. The url for the API would be www.yoursite.com/myvar in this example.
You could try using this lib:
https://github.com/siriusastrebe/syc
and if you want to implement yourself look into Ajax. Jquery have a pretty simple ajax wrapper (http://api.jquery.com/jquery.ajax/). offcourse you need to open corresponding urls on the server to return / set the values.
Try socket.io http://socket.io/ it uses websockets on modern browsers and gracefully degradate to older technologies like AJAX with older browsers, leaving user experience the same.
Check out details here Web Socket support in Node.js/Socket.io for older browser
res.locals, either EJS, Jade or something you create yourself, is usually a good thing, and makes it easy to transfer data to the HTML at pageload without any additional requests.