FuelPHP application with Backbone.js model.save()

Tweet about this on TwitterShare on FacebookShare on LinkedInShare on Google+

Backbone.emulateJSON = true;

I’ve working on a FuelPHP web application with Backbone.js and encountered an issue where model.save() sends a wierd dataset to the server.

That code seems perfectly fine, but the sent data is ..

What!? How come the whole object turned into a key of the sent object?
I was totally lost for 3 and an half hours.. Then, got the answer!

This convert the obj to this.

Happy :)

json_decode(Input::put(‘model’));

Now, move on to FuelPHP REST controller. The sent object data (Input::put(‘model’)) need to be decoded by “json_decode()”;

What a annoying staff! Happy though :)

Yeoman generator-backbone

Tweet about this on TwitterShare on FacebookShare on LinkedInShare on Google+

For starting up backbone application, “generator-backbone” for Yeoman is the best way ever!

Install generator

https://github.com/yeoman/generator-backbone#readme

Scaffolding the app

Now you are ready!

Build with Grunt

The app is initially implemented with Grunt which enables you to build your app as the optimised.

Grunt for build

A command “grunt” runs build process where sass compiling, css, js are minified and so on.

There will be a folder called “dist” where all the optimised fils are located!
That is pretty cool!!

Grunt server

A command “grunt server” establishes a server with port :9000 for you to preview the site.
Additionally, this is the best function it provides, it observes the file update, which means once you made a change to one of the files, grunt automatically builds the sources!!!!!



Yeoman + Bower + RequireJS + BackboneJS

Tweet about this on TwitterShare on FacebookShare on LinkedInShare on Google+

Yeoman provides us scaffold function for various development.
Here introduces BackboneJS application with RequireJS.
Those packages are managed by Bower.

Install Yeoman

After installing Node.js, just run the following.

If you fail, please run it with sudo.

Install generator-requirejs

Setup project

Create scaffold

Seup BackboneJS

Now you have all the packages in a folder “bower_component”!