The Underscores WordPress starter theme has seen a flurry of activity in recent days, adding support for Sass and automated testing with Travis CI. The theme has been forked more than 1300 times on GitHub with many interesting variations created to support various theme features and frameworks.
One fork in particular is getting WordPress theme developers excited about the possibility of bringing in new Javascript-powered features. _s_backbone is a new theme based off of Underscores that incorporates the WordPress REST API Backbone.js client.
Taylor Lovett, Director of Web Engineering at @10up, created the theme as a proof of concept but also hopes that it will become a useful tool for theme developers who want to get started using the WP REST API. The API is slated for inclusion in WordPress 4.1.
Advantages of Using Backbone for Infinite Scroll
So how is _s_backbone different from vanilla Underscores? The major difference here is that the loops have infinite scroll built in using a “more” button, a feature powered by the Backbone client which grabs posts on the fly without reloading the page. This provides several advantages. “On the web today, people expect reactive, dynamic web applications. I think everyone can agree the web is shifting to a more JavaScript reliant place,” Lovett told the Tavern. “Powering your loops using JSON REST API’s Backbone client is the easiest way for you to add and customize infinite scroll to your website.”
Adding infinite scroll to a theme using other methods can be a frustrating, complicated experience. “There are a few advantages to building infinite scroll with the JSON REST API as opposed to something else,” Lovett said. “The JSON REST API will be merged into WordPress so your code will always be backwards compatible. With the JSON REST API and Backbone client, you don’t have to build your own endpoints which is time consuming. Also, the JSON REST API is, well, RESTful making it extremely easy to use.”
I asked Lovett how _s_backbone’s implementation of infinite scrolling differs from Jetpack’s module. Is this feature something that functions better as part of a theme vs. a plugin?
“I’ve worked extensively with Jetpack’s Infinite Scroll module. In fact, _s_backbone takes some code from it,” he said. “I think valid arguments can be presented for including infinite scroll in either a plugin or a theme. However, I think with the advent of the JSON REST API and Backbone client, adding infinite scroll to the theme makes more sense.”
Although the theme’s main attraction right now is a new way to power infinite scrolling, Lovett hopes that _s_backbone can provide a starting place for developers to create their own Backbone-powered features.
_s_backbone is a starter theme, not a parent theme. Decisions are left to the theme developer. If the developer feels like it, they can rip out infinite scroll completely or put it in a plugin. The goal is to provide the theme developer with a good base with which to start and let them build from there.
In the future, Lovett plans to add post format support to the theme, as it’s currently missing that feature. “I’m hoping to get some feedback on the starter theme to best assess what would be most useful to developers,” he said.
The WP REST API Opens Up New Opportunities for Theme and Plugin Developers
Lovett will be speaking this weekend at WordCamp Boston on the WP JSON REST API where he hopes to use the _s_backbone theme as an example. His largest contribution to the WP REST API project has been the creation of the Backbone.js client. He also contributes on the PHP side, assisting with post meta, comments, and revision endpoints.
“I’m very excited about the implications of the JSON REST API in the backend,” Taylor commented on the future of the project. “I believe the JSON REST API will be incredibly useful internally, especially cross-site (in multisite). I’ve written many endpoints to retrieve different custom post types for backend features that could be dramatically simplified with the JSON REST API. Also, I think it will simplify the code powering the media library.”
Lovett hopes to introduce developers to all the possibilities of using the API while at WordCamp Boston. “First and foremost, I want to show people why the API is useful and how you can use it,” he said. “I want to inspire plugin and theme developers to build amazing things with the API. I believe a RESTful API within WordPress opens up a lot of doors. I’d also like to show people how you can grab data from other websites that use the API instead of parsing feeds.”
If you’re familiar with Underscores, then Lovett’s new _s_backbone theme is a nice starting point for learning more about using the API in a theme. Feel free to leave feedback on the project regarding additional features you’d like to see powered by Backbone. If you’re interested in contributing to the WP API project, the Backbone.js client, or elsewhere, Lovett encourages you to get involved, as the team is always looking for more help.
I guess you should also see this backbone.js implementation with WP-API as backend.