With the WordPress JSON REST API (or the WP-API) slated to be included in core by the end of 2015, there are lots of different ways people are planning to use it to build cool things.
This article takes a closer look at client side applications using the WordPress JSON REST API, and explains exactly why you should be excited about them.
Web Applications and MVC
The difference between a web application and a traditional website is confusing as the line is often blurred. I won’t get too much into detail, but this article on Vision Mobile can help you better differentiate the two.
You can’t talk about web applications without discussing MVC (Model View Controller) frameworks. Although WordPress is not technically an MVC framework, it can come pretty close. The ability to decouple the three layers means that each layer can be independent and very powerful.
Client vs. Server Side
WordPress renders what you see server side. The client (browser) sends a request to the server, the server looks through the code, and then parses HTML to send back to the browser. For a traditional web page, a browser will send an http request to the server with the page that it wants. The server will then look at the request, grab data from the database, and parse through the PHP loops and conditionals. Once it completes that process, it sends the finished HTML back to the browser.
But what if you could offload all of the HTML parsing to the client, and just have the server send back the data that you need for that view, and have the client render out the HTML, CSS, etc. based on the data? This is called ‘loading Client Side’ and it’s something that the WP-API allows you to do.
The code above uses jQuery to grab the data. In this case I am only grabbing post type “pages.” I then take that data and create an article element for each “page” and append it to the content-wrapper.
Why Not Just Do It Server Side?
Think about what I mentioned earlier: with a server-side request, the response is fully parsed HTML, but when using the API the response is just text JSON. The server’s response offloads nothing more than text and parsing to the client, so there is much less load on the server.
Thinking Outside the Box
It is not hard to see that this is not the traditional WordPress thought process that typically includes a directory full of PHP templates. But that is the best part. Client Side Applications powered by the JSON REST API and WordPress is a very creative idea, which goes to show you that with a little outside-of-the-box thinking, you can create something pretty amazing.
Ultimately, A Very Scalable Application Solution
Let’s take everything I said and put it together. With the WordPress API you have a faux MVC structure to really decouple the view (what people see) from the database, from the logic connecting the two. Three decoupled layers. You now have a server response that is much faster and lighter, so you can easily have more simultaneous users.
Finally, the view cannot just be cached and minimized, but moved to load entirely via CDN, reducing bandwidth and bottleneck on your hosting server.
Is Anyone Doing This Already? Short answer, yes, and in a lot of cool different ways. Here are a few that specifically focus on web applications using client side technologies powered by the JSON REST API
Reactor & Appresser
While this is not a web application, they use all the technologies that I am excited about. They use Ionic framework, which is AngularJS, to build native mobile apps. Ionic’s data is powered from the API in WordPress, so overall it pulls all of these exciting technologies together to build something awesome.
CodeCavalry.com is a website that helps users who need code help get coding help from experts instantly. It was launched in March 2015, and is built with AngularJS and the API. CodeCavalry is a single page application, and is another example of something really exciting.
Josh Pollock wrote an awesome article on some of the applications being built on WordPress—while not all of them using the same technology stack that I am excited about, he definitely points out some great examples.
So what are you excited to use the JSON REST API for?