Confusion about Backbone.js and Django - javascript

I'm trying to use Backbone.js for my Django project and it's confusing. So to my understanding, I need tastypie for the RESTful API with Django to which I'm new, so for example I have a SongResource like follow :
class SongResource(ModelResource):
class Meta:
queryset = Song.objects.all()
authorization = Authorization()
All what this does is gets back a list of all the songs I have in the database, right? To my understanding, I should use this in the Backbone.js router to get all the songs, and then do all the data manipulation in my JS code instead of the Django's view?
So if I want to get all the songs that the logged-in user purchased, I should get all the songs from Django, and search for the user's songs in JS code?
Also, what if I want to save songs the user listened to for example, I'm used to do that by sending an Ajax request to a view where I save the action.
Another thing is, let's say I have five models in my Django app, should I create the give models in Backbone.js too?
So in Backbone.js, I just get the data from Django and manipulate them in the front end instead of the Django views as I'm used to?
If you can see my confusion please guide me to some articles, tutorials, videos whatever !
Thanks a lot

You definitely have to do the filtering on Django side :) I know nothing about tastypie, but as of current (logged in) user, you have that in django session, therefore you cannot rely on Meta.queryset, instead the queryset changes for every request. You probably need to override some view method.
As of saving listened songs, you first decide when to do that (start or end of song), and upon that event you save() some Listening (Backbone) model, that will trigger the XHR request (see Backbone.sync).
Yes, you should Backbone model counterparts for your Django models if you use them client side. Again, see Backbone.sync

Related

django rest framework API edit function

though I am new to django rest framework, all in all, i get how the posting and viewing works each using jquery ajax to post and angular js for rendering the API json data.
but i don't understand yet how the 'edit' and 'delete' function should be implemented here.
it means i have to load preexisting title and contents to the designated field forms and resave the post into that specific post id.
how can i do that?
and how can i check the permission when executing edit or delete function using either jquery or angular?
please consider the fact that my website is SPA (single page app) that shouldn't require any sort of page refresh.
so these concepts are fairly new to me, and i don't understand how i can manually check the permission using only the API
here is the live site : http://192.241.153.25:8000
You can use class based views for this. Using class based views you can have different end points for different functionalities, differentiating on Request types.
class AView(APIView):
def get(self, request, format=None):
pass
def put(self, request, format=None):
pass
for authentication and permissions do refer to http://www.django-rest-framework.org/api-guide/authentication/#tokenauthentication

Create Multiple Dynamic views inherited from single template

I am creating mobile chat app in angularjs.
It has lets say 100 userlist. If user presses on some userlist, it takes to next view(chat view). So, as user presses on userlist . I want to create a dynamic chat view of that user based on his userId.
One way of doing this is - I define the route like this 'chat/:userId'. Then access the userId. Also messages of particular user is coming from server. And new chat messages is appended to the view.
I have doubt that if user open the same view again it will load the basic template again because view is changed . It will again send the request to server again. It should not.
For clearing the question, In mobile jquery (http://iflychat.com/drupalchat/mobile-chat)
If user opens the view lets say public chatroom , It only takes load time once. If we again come back to this same view, it loads instantly. It creates the view based on url. Is this kind of functionality possible in angularjs?
Angular has an $http cache that could help you accomplish something similar:
$http.get(url, { cache: true}).success(...);
There are also a few other ways using the same cache.
Here is a very detailed post How to cache an http get service in angularjs
Thanks,
Paul

Backbone sends form through GET

I'm learning about Backbone.js and I built an app which has a form.
Following the rules, I have a Book model, a Library collection, and a Book view. This view controls the form.
Everything runs ok, the communication with the API (which is running on Node.js) is also ok. But when I submit the form to save a new book, Backbone sends it through GET, and my API is waiting a POST (as it is used by CRUD operations).
The form submission is done by Backbone; when I click on submit, the called action is this.collection.create( new BookModel(formData) ). As we can see on Backbone's documentation, this action sends the model to the server, and after that the model is added to the collection.
Backbone.sync says that it sends the data through POST, but it is sending through GET.
I'm following the example of Developing Backbone.js Applications book.
I found the problem. I set the view's el as tbody (I would like to have all the books listed inside a table).
If I set the el to body it works. It seems that we have to set a exclusive View to the form, and another one to the list (table).

How can i use REST in python django for multiple tasks

This is the first time i am using REST for any web applications.
For normal get an post and i simply call the API done in Django Rest Framework.
But i am not able to think how can i deal with situations where something more needs to be done.
Suppose I have
List of users in database and their product they have bought.
Now i have web form where if someone adds the user and then submit the button , then
I have to get the list of items bought by that user in 5 hour window
Update the row in database which says buy_succeessful to false
Then again get the list of orders from the items he has bought and then update the rows with order_successful to false
Now current in my submit actions i am doing like
call to api to add the user in override manual enrty table. This is simple post to that table
Then after getting the sucessful tehn i again call api to list of items this user has bought using Query parameters . Then i have the list
Then again i loop through the list and post to api for updating that record in datbase
and so on
I am feeling this is not right.
I have found that quite often there are some more things to do tahn just saving individual objects in database.
whats the best way to do that. DO i need to have view api for every function
Try the 3rd step of the DRF Tutorial:
http://www.django-rest-framework.org/tutorial/3-class-based-views
Here, it shows how to do a "PUT" request for updating data. And also some of the other DRF features.
Also, you can reference serializer.object which is the object instance of the django model record that you are saving to the database. This question here talks about adding extra attributes, etc... before saving to the database:
Editing django-rest-framework serializer object before save
You can also access the record post_save and there are other hooks in the framework that you can use.

Are there any Backbone.js tutorials that teach ".sync" with the server?

I read many Backbone.js tutorials, but most of them deal with static objects.
Of course, I have data on the server. I want a tutorial that shows how backbone.js can communicate with the server to fetch data, post data, etc.
This is .sync, right? I read the backbone.js documentation, but still fuzzy on how to use this feature.
Or can someone show me an example?
According to: http://documentcloud.github.com/backbone/#Sync
Backbone.sync is the function that Backbone calls every time it
attempts to read or save a model to the server.
But when? Where do I put the function? I don't know how to use it, and the documentation doesn't give any examples. When does the data get loaded into my models? I get to define when...right?
You never really have to look at .sync, unless you plan to overwrite it. For normal uses, you can simply call model.save() whenever you want and that will execute a post or put (depending on whether the record exists already). If you want to get the data from your backend, use collection.fetch()
You'll of course also need to specify a URL, do so through your collection attribute, collection.url
You can override Backbones native sync functionality if you override it:
Backbone.sync = function() {
//Your custom impl here
}
After that this function is called whenever you call a backbone function like .save() on models or .fetch() on collections. You do not have to care about data transport anymore.
I would suggest taking a look into Backbones source and look how the default sync function is implemented. Then create your own or adopt your server to support the native function.
They are not free, but the following screencasts both have a piece on backend work and how to send data to and get data from Backbone.
Tekpub is a 9 part screencast about asp.net MVC3, with the whole 6th part about using backbone to write an admin module to manage productions. it shows all about handling routing in MVC3 and sending & receiving data
Peepcode
http://peepcode.com/products/backbone-js about basic backbone stuff
http://peepcode.com/products/backbone-ii about interactivity
http://peepcode.com/products/backbone-iii about persistance (it's this third one you will need for server connection information).

Categories

Resources