Python backend to Backbone.js - javascript

I am trying to develop a way for Python to build web applications. Using just one HTML file and a python file, the user should be able to develop a small web application. The connection between Python logic/events and HTML can be javascript, and wanted to use something that made life easier than passing a DOM object back and forth.
I found Backbone.js, and thought that this may be something to look into. Any ideas?
I was thinking that Python could create events in javascript structured by Backbone, and then the javascript could talk back and forth with server/client very easily.
Would this work? Or the use of a DOM object with all of the HTML id's and attributes is necessary to use?

Here is how we create the webApp:
At the client side, using HTML5+Javascript and backbonejs
At the server side, using Django and its REST plugin
REST API is used between the client and the server
[Client/HTML5+Javascript + Backbone] ← REST → [Web-Server]—[Django/rest-plugin]
There are a few rest frameworks for Django.
django-rest-framework
tastypieapi
django-piston
Alternative to Django
flask
Also you can see the post in here as well.
Good luck!

Related

What is the purpose of template engines in Java?

I'm an android developer and about two years and recently I've been thinking about building web applications. So I started researching about spring boot and everything is great. Then, I came across this thing called template engines (thymeleaf) which by definition separate your code from presentation.
What is confusing me is how can a backend server have html? should the presentation be handled by html, css and javascript in the front end? I even saw tutorials where they actually type in html code in their controller as return values.
My understanding is that the backend server exposes APIs for the frontend to use by using AJAX and the frontend will manipulate this data and present the information on the screen, why would a backend provide html code?
THank you
the frontend will manipulate this data
What front end? You mean the JavaScript code in the HTML page? Where did that come from? Oh yeah, the server.
It is the server that serves the HTML pages to the client, as well as any .js and .css files.
The server could provide static pages, and anything dynamic is handled by JavaScript. Or, the server could dynamically build the HTML page, using ... you guessed it ... a template engine.
You generally don't want JavaScript to build the page initially, just to use JavaScript for handling any dynamic behavior. Some pages don't even need any dynamic behavior.
Unless of course you're thinking about single-page applications (SPA), where there is only one root HTML page, and everything else is built client-side with JavaScript and AJAX calls, but most web applications are not SPAs.
Thymeleaf replaces JSP by providing HTML pages using a template engine. The controller requests the HTML file and Spring Boot provides that template after building it using the Model provided.
Thymeleaf is great because it allows you to rebuild templates on the fly. Lets say for example you're showing a users points to them on the front end, but maybe the points increase or decrease.
What you can do is build the template in the background using a Model. The Model reference is magically provided to the template provided which parses it.
#RequestMapping(...)
public String request(Model model) {
model.put("points", 5);
return "my-template.html"
}
Then use the Thymeleaf language to provide your object to the HTML file to be processed in the engine during runtime.
<html..>
<head>...</head>
<body>
<h1 th:text="${points}"></h1>
</html>
Spring Boots Template engine will build this in the background and present it to the user, but it will show the actual points to the end user! Hope this helps a tiny bit.
I know this question has been answered pretty effectively so far, but I want to add my two cents in as I work with Thymeleaf often.
The easiest way to think about a template engine is that it allows some dynamic development of html based on information passed to it by the controller method. This allows you to put logic in that normally wouldn't exist, or say display a certain section if a user is perhaps logged into admin.
If web pages were houses, html is the frame, css is the walls, Javascript is the lights and electricity, and a template engine would pretty much just be the architect designing the plans on the fly before the frame was built based on desires of the buyer of the house (user inputs).
OK, newer Apps and websites may just load/boot/open once and then pull or push data via AJAX requests, this is good, it saves traffic and it is fast.
But it has not always been like this and some Frameworks still don't build everything on small requests. Spring in Java or Symfony in PHP are MVC Frameworks and use template engines to build pages. This may sound a little outdated but there is still a lot of websites using this.
And if you build a web app for a customer with slow PCs or other devices and the page contents are performance heavy you might want to do as much work as possible on the server so that the user does not have to wait for long. And also you can cache the rendered pages. There is even server side rendering of react pages to e.g. make the initial page load faster...
With Java and Spring I did just use JSP I don't know thymeleaf. Just use what you like and maybe what is most supported/documented.
And building websites like this does not mean you cannot use AJAX, but if you use templates you need to think about what makes sense.
What is confusing me is how can a backend server have html?
The "back end" must have HTML, because that's what's delivered to, and rendered by, the client.
It may just be that the back end "server" is just a CDN delivering, say, an HTML/JS SPA, but there's still something delivering content to the browser.
That said: server-side rendering is still a thing, and has had a resurgence lately--a React app may have its initial rendering done on the server so again the client gets a page rendered with both HTML and associated data, and then starts acting like a normal SPA.
My understanding is that the backend server exposes APIs for the frontend to use by using AJAX and the frontend will manipulate this data and present the information on the screen, why would a backend provide html code?
Because something needs to run the JS to access those APIs.
Some history:
Browsers used to suck. JS used to be a neat add-on, sites were relatively static, and essentially all rendering was done on the server. The back end would get data from wherever it got data from and generate complete HTML pages, and there was little happening on the client side other than some form fields, maybe some validation, and that was about the extent of it.

How to make a web GUI for Python 3 (Javascript communications)?

I've made a program in Python 2.7 with a wxWidgets GUI. Now, I want to improve it by making a web GUI, make it multi-platform and port it in Python 3.4. For this purpose, I have to make Javascript and Python communicate (i.e : I want my Python to react on some event on the page and I want my page to react on some Python actions).
I don't really know how to do it, and I don't even know if it's possible.
I've find some libraries, but some are just for Python 2 (pyjamas), and some don't provide what I search, or I don't search enough ^^ (web2py, turbogear, cherrypy).
I would like to find a complete library that ease this communication, and that is rather known and supported, with a compete documentation.
Maybe, there are other ways to do such a web GUI, but I don't find them.
Thanks !
I guess what you want is a single page application.
I would suggest to wrap your python code in a RESTful Api using a python web framework like Flask. This would isolate your python code from the presentation layer.
You could then write the UI in html and javascript and use AJAX to call your python api from javascript.

Creating a dynamic web page using AngularJS, WCF Service and SQL Server

I want to create a web application and I am exploring how I could do this. So I came across AngularJS. I want to use WCF Service and SQL Server in my application also. I am trying to find what AngularJS, WCF Service, SQL Server can do for me because I do not want change technologies in the middle of my project after discovering that AngularJS cannot do things which I want my application to do.
So, my question is can AngularJS help me create Static web pages and Dynamic web pages?
I can start my project in ASP.NET MVC but I want to explore AngularJS and want to find out what it is.
My project is about
Sending E-mails
Displaying content from database (in any manner using Ajax)
Voice chat, Video chat, Text chat
Can contain Javascript, jQuery, CSS, HTML5
Tell me something about it. Any suggestions?
Thanks
Your question is vague, but I'd suggest using Microsoft WebAPI instead of WCF or even ASP MVC, due to the from the ground up RESTful design of WebAPI and much easier configuration.
Using this approach, you'll still be able to query SQL Server in C# using WebAPI, so you won't need to switch your database.
There's very little documentation by comparison for querying non-RESTful web services, so you'll gain a huge advantage in terms of tutorials, blogs, etc. by going this route.
Please see below for your questions:
Can AngularJS help me create Static web pages and Dynamic web pages?
Yes certainly it can. Check it out at the official website
2.Sending E-mails
This should be the server side responsibility using an e-mail client, for instance SMTP client
3.Displaying content from database (in any manner using Ajax)
Yes, it certainly can.
4.Voice chat, Video chat, Text chat
Try WebRTC first to see if it's sufficient for your tasks
5.Can contain Javascript, jQuery, CSS, HTML5
Yes, you can use whatever you want as long as you are sure about what you are doing.
I hope following guidelines will help you.
When you create the project select WebApi template.
Then include angularjs files in the scripts folder.
Use cshtml files,but do as you in html file.
Use angular client side mvc features to build your app fast and performance.
Use the angular http service to call webapi methods.
All the c# specfic features build in the webapi.

java script website best practice

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.

how to use Backbone.js with the Symfony framework and or Apache Thrift

I recently installed a web app which use Symfony2 framework and Apache Thrift.
Now I would like to make backbone usable in Symfony2 framework.
My question is about Backbone.sync.
How can I override/use Backbone.sync in order to get data from the server in a web app using Symfony2 framework and/or Apache Thrift ?
Are there some tutorials on the web for do it? I just found this one Symfony + Backbone.js for highly dynamic apps, but it doesn't say nothing about how to get data from the server.
By default, Backbone.js and its sync method can work with REST APIs without any modification. So if you can create a web service with Symfony2 that can handle GET/POST/PUT/DELETE and return JSON, you should be good to go.
I'm not terribly familiar with Symfony, but for a basic REST API, you'll need to define your URL routes (e.g. "www.yourdomain.com/api/items"), and then create methods to perform actions based on those routes (e.g. return records in JSON encoded format).
Here's a quick tutorial on creating a REST API with Symfony2: Symfony2 REST
Also, check out Wine Cellar tutorial on the Backbone tutorial page. It uses PHP Slim framework, but the backbone.js concepts will be exactly the same, because as long as you are using a basic REST API, backbone is back-end agnostic.
Check this bundle https://github.com/gigo6000/DevtimeRafflerBundle it's a small simple app that includes some basic REST actions. This was created with https://github.com/gigo6000/DevtimeBackboneBundle

Categories