What of instead of the standard Django template rendering model which is server side, there were a library that allowed something that looked like a Django template to be rendered with JavaScript in the client's browser? The variables could be filled in by getting a JSON blob from the server and rendering the template would be done entirely on the client side.
Does a library like this already exist?
As I understand it, GWT sort of does this, but behind the scenes and with a ton of programmer overhead.
I think you may be thinking of the recently announced jQuery template plugins. There are of course other solutions out there, this has gotten the most press lately, with a similar syntax to what you describe.
Google Closure has a template library, there is TrimPath, and there is a long list of answers over here.
you probably think of mustache, but you can also check pure templates
Related
I'm totally new to js template engines. Handlebars seems to be the popular choice. I don't dislike the syntax for doing conditions, loops and so on, but since I'm perfectly capable of and feel more comfortable using plain old js and I'm not planning to let anyone who doesn't know js touch my templates, I'm asking if Handlebars supports this.
Of course the most popular choice isn't always the best. I'm more of a Mootools guy and jQuery drives me crazy(great library, just not for me). So if Handlebars was jQuery of template engines, what would be Mootools?
One of the central ideas behind handlebars and mustache is they are LOGICLESS by design and intention. They can not now, nor will they ever allow or recommend you embed raw JS in your templates. Some say this is a better design. If you want embedded javascript, almost every other traditional templating engine, such as _.template or jade or EJS is based on (or at least supports) the idea of embedded JS code snippets.
Sorry to resurrect a old issue here. If you have to use handlebars or it's not feasible to change your templating library you can use Helpers from the Handlebars library.
https://handlebarsjs.com/guide/expressions.html#helpers
Registering a helper in handlebar can be a walk around to what you are trying to do. See this link for a complete example: Registering handlebars helpers with node does absolutely nothing
I currently have an application that loads the html header, navigation, and footer information into an html page using separate php includes.
I am trying to re-design the application so that it no longer is dependent upon php includes (so that I can port it to PhoneGap). I have been scouring for a solution that would allow me to get the same templating functionality, while shifting the php scripts solely to the server.
I have looked at a number of the Javascript Template Frameworks - ractive, moustache, handlebars, etc. But most of those seem only data focused - which is great for that purpose, and I may use one for later. But I am looking for something to provide the bones, not the attributes. Also, each of those seems to have routing/url/seo limitations.
I have also tried some of the frameworks like Meteor, Ember, Express, and Sails but they will require a lot of additional coding to get to the same functionality I currently have - but they have the ability to define application level templating/includes. Slim Framework seems to be closest (and maybe coupling it with Twig ), but before I commit I wanted to get some feedback/option.
Is there a better way to do this?? And if so with what? And maybe even how?? Thanks all in advance for your feedback!
After looking through a number of the solutions, I feel that using jquery with handlebars. will actually be the best solution. It does not allow me to do exactly what I'd like to do, but it is close.
I will keep the module pages as separate html files in a templates folder and then inject the moustache modules into the container page using jquery ajax and/or .load.
I've noticed that I often duplicate razor code by making javascript templates for ajax loading. And then if I want to change serverside template I have to change js template too, what can I do to minimize such duplication? Thanks for answers, and forgive my english:)
One of the possible solutions is to use the same template engine on the server side and on the client side for the specific purpose of AJAX requests.
Mustache is a good choice - it's available both for .NET platform and for JavaScript.
I am building a website using the below stack. For this question, I think the software stack should not matter. I am more interested to know whether the way I am doing the project seems like a good idea or following the best practice.
- Twitter Bootstrap for the UI
- CherryPy
- jQuery
So the way I approached the project is like the below
- Use the Twitter Bootstrap to create the basic layout
- I have one js file and one css file for my project
- Based upon the requirement, let say for this button I need to do something like ajax call
- go to the js file and write like $("#id").click() and do the necessary stuff
- write the necessary action code in python
- Test
So basically, what I am doing, modifying the html file, adding the necessary code that I need in my single js file and do the python code. Seeing all this java script framework like backbone.js, require.js makes me feel that maybe I am not following the best way to do it.
In a sense, what I want to know is that assuming you have a website with few pages that does not have heavy user interaction how would you do it? Is there anything wrong the way I am approaching it? What would be best way to do it?
Thanks
Client side frameworks like Backbone, Angular, and Ember are built to help bring structure to heavy javascript applications. Don't get confused between a client side language like javascript (although now it can be used as a server side language to) and a server side language like C#, Python Php etc.
Most Single Page Applications consume a REST API. So all your functionality will be on the client side. Your server's primary responsibility is to push data to your client so the user can interact with it. Think of your client (written in js) and server(written in python) as two completely separate entities/apps.
If your application is not javascript heavy, I would not go with a Single Page Application and use your current listed tech stack. I would always recommend keeping your javascript structured, but you dont need a framework for this. Just follow one of the js patterns you feel most comfortable which can be listed here.
I want to have achieve something similar to Java Tiles framework using only client side technologies (no server side includes).
I would like to have one page, eg layout.html which will contain layout definition. Content placeholder in that page would be empty #content div tag.
I would like to have different content injected on that page based on url. Something like layout.html?content=main or layout.html?content=edit will display page with content replaced with main.html or edit.html.
The goal is to avoid duplicating code, even for layout, and to compose pages without server-side templating.
What approach would you suggest?
EDIT: I don't need a full templating library, just a way to compose a pages, similar for what tiles do.
JavaScriptMVC has a view templating system that supports different engines, including a pure JavaScript based one called EJS.
You might also want to look into Mustache especially Mustache for JavaScript.
If you would like to use jQuery, there is a decent templating engine in development as well:
http://github.com/jquery/jquery-tmpl
http://api.jquery.com/jquery.tmpl/
Check this out:
http://layout.jquery-dev.net/
I thinks it's close to what you want.
I am looking at javascriptMVC at the same time.
In the forum they are talking about using jquery layout with it.
I don't know if it fit exactly to what you want to do, but using the GWT seems to be a good approach for rich client-side applications :
You write all your application in Java with the framework, and you compile for obtain HTML and JS files working stand-alone.