0

I am somewhat new to javascript. Is there a common technique, best practice, javascript library/framework etc for converting JSON data from REST web services into HTML5 markup?

I am building a web application that uses a HTML5/Javascript page to consume JSON from RESTful web services (written in Java). It will be a single-page web app that I want to inject additional HTML5 controls into, depending on the actions that the user performs on the page. I am not writing several HTML5 templates and simply injecting JSON data into the controls, which seems to be one of the more common techniques out there, but instead generating HTML5 markup on the fly. I am doing this because there are a large amount of variations in HTML5 control types and positioning that I want to occur in the web app due to the interactions and data involved.

So, more specifically, something like this:

<html>
<head>
<title>My Web App</title>
</head>
<body> 
<script> 
//  javascript calls RESTful service and injects generated HTML5 here 
</script>
</body>
</html>

At the moment I can only think of two ways to do what I want to do:

  1. Send JSON straight to the page, and write Javascript (or use a library) to generate the HTML5 markup based on the JSON data
  2. Send the HTML5 markup straight to the page, letting the web service do all the HTML5 conversion (perhaps with slower performance due to markup being transferred across the network?)

Thanks for the feedback.

Fuzzy Analysis
  • 3,168
  • 2
  • 42
  • 66
  • 2
    You can use template systems on the client, which lets you generate HTML on the fly via the great conveniece of a template mechanism. – Pointy Sep 13 '14 at 23:12
  • Thanks Pointy. Got any examples? – Fuzzy Analysis Sep 13 '14 at 23:12
  • 1
    I'm a huge fan of [doT](https://github.com/olado/doT) because it's *extremely* flexible, small, and fast. You can compile templates to JavaScript functions on the client or do it server-side. It works in browsers or in Node (I even use it in Rhino). The compiled template functions just return strings, so it's easy to invoke partial template functions from within other templates. It lets you customize most anything important about how templates are transformed into functions. – Pointy Sep 13 '14 at 23:15
  • Thanks a bunch. I used http://garann.github.io/template-chooser/ to arrive at the same conclusion. Underscore is apparently useful as well. Much appreciated. – Fuzzy Analysis Sep 13 '14 at 23:33

0 Answers0