CODEWITHSUNDEEP
phpbackbone.jsknockout.jscontent-management-system
bravokiloecho
bravokiloecho

Reputation: 1463

Using Backbone / Knockout (etc.) with a PHP CMS

I'm a front-end-centric web-developer, fairly confident with JS (mostly jQuery) and bits and pieces of PHP used in a few PHP-based CMS templating languages (eg, ProcessWire, ExpressionEngine). I'm excited by the idea of backbone but have been struggling to find a way to incorporate it into my current methods of web development...

A current project requires me to build an editorial-style site with sections and articles which ideally would run as a single-page app with AJAX loading of content. Backbone looks like a great way to do this but what I can't figure out is how (if at all) Backbone would work in tandem with the PHP-based CMSs I'm used to working with.

I recently came across the Gentlewoman magazine site which seems to run off WordPress + Backbone so it seems it is possible but I can't find any backbone tutorials that mention working with a pre-existing (PHP) CMS.

Is this a tree worth barking up? And if it is, what's the best way to go about it?

Upvotes: 0

Views: 657

Answers (2)

user1716672
user1716672

Reputation: 1073

I do exactly this with Backbone.js, Joomla or Wordpress and xml. An xml feed can be easily generated for every article you create with Joomla or Wordpress. In Joomla there are plugins which provide an xml feed of details of all the latest articles. The plugin I use is called Ninja RSS syndicator. In wordpress, a feed of the latest articles should be built in. In your Backbone model, you would then do something like this to override the fetch:

        fetch: function (options) {
            options = options || {};
            options.dataType = "xml";
            return Backbone.Collection.prototype.fetch.call(this, options);
        }

You would then override the parse function to parse through the xml feed and create your model/collection:

        parse: function (data) {

            xml = data;


            $(xml).find('item').each(function (index) {

                title = $(this).find('title').text();
                description = $(this).find('description').text();

                parsed.push({id:id, title: title, 
                            description:description});

               id++;
            });

            return parsed;
        },

In effect, Joomla or Wordpress works only as a CMS, with the frontend built seperately with Backbone.js. I use this methods to build Phonegaps apps from Joomla/Wordpress sites.

Upvotes: 2

halfer
halfer

Reputation: 20439

I've not tried this, so I won't say you shouldn't do it, and everything's possible (in theory). However, it sounds like a round peg in a square hole, to be honest. Wordpress and similar systems do what they do in a certain way, and they're very much classic server-based content management systems, with a smattering of AJAX on top.

You could certainly try it - serve a custom theme with no content, just containing placeholder divs, and then run an AJAX operation to decorate them. I suspect a child theme would be pointless here, as you'd be overriding everything. Write a theme from scratch instead.

The one thing I would say here is that I'd not advise making the admin system into a one-page AJAX app. Not only would this be a huge amount of work, but you'd be fighting against quite a lot of plugins and core functionality that assumes it is a server-side application.

Upvotes: 0

Related Questions