Jesse Lawson

Software engineering, artificial intelligence, writing, and open-source tools

Jan 1, 0001 - AngularJS Ideas & Theories WordPress

On WordPress as an AngularJS Backend

WordPress provides a web interface for manipulating a MySQL database, but the static nature of WP’s php files disables its ability to serve itself as a Single Page Application (SPA). To capitalize on modern web technologies, AngularJS could be employed as a front-end system that draws from a MySQL backend that is modified by WordPress.

When I was searching for a way to use AngularJS with a WordPress backend, I came across an article1 that discussed using AngularJS from within a WP template. This is suitable for an application that wants to reside within WordPress, however, it would not work for a separate application entirely. This short article explores creating a separate AngularJS application and using a WordPress instance solely as a database controller for partial views content.

WordPress provides a web interface for manipulating a MySQL database, but the static nature of WP’s php files disables its ability to serve itself as a Single Page Application (SPA). To capitalize on modern web technologies, AngularJS could be employed as a front-end system that draws from a MySQL backend that is modified by WordPress. This would enable the front-end application to be static (insofar as it does not need to change because its dynamic nature comes from the content being drawn from a SQL database) and the back-end to be managed by a user-friendly, tried-and-true web interface.

A few limitations arise from this. If we want to use WordPress posts and pages as content that is dynamically loaded into partial views, we’ll need a way to communicate with the database. We can employ a server-side script that will act as a RESTful api, polling the database and returning the results accordingly, but this prevents our application from being server agnostic. Unless we want to use static .json files to hold the data, though, this is our only option unless we want to explore running a nodeJS server alongside our application.2

Another limitation is that we will be using WordPress’s storage system, meaning we will be unable to customize any pages beyond the normal Bootstrap/HTML/CSS3 layout customizations that are intrinsic to such a system. If the application required each individual route to have its own controller and injected services relationship, using a WP backend would not make sense. However, since we are only looking for a system that will easily manage our MySQL page and post data for us — and not a system that will allow us to create and edit AngularJS controllers and services — WordPress can be seen as a more user-friendly version of phpMyAdmin in this regard.

So why WordPress? The idea here is to use an existing CMS system’s administrative tools that manipulate SQL data in order to capitalize on its functionality. Instead of reinventing the WordPress dashboard in an AngularJS deployment, we are using the WP dashboard as a SQL manipulation system apart from the application’s use of AngularJS for rendering the view. Could we use a simple CRUD system to create and modify posts ala WordPress? Sure, but by using WordPress as a foundation, we are extending the open source community’s knowledge on WP and facilitating the vertical expansion of WordPress as a platform for future web applications and services.

Going forward, the process is very straightforward. A partial view would be rendered according to a given route, and a page loading service would take the requested route and perform MySQL commands to Create, Read, Update, and Delete (CRUD) the content.

  • Using AngularJS with a WordPress Backend
  • This is definitely the most popular method of deploying applications to the web. Server agnosticism is something that is becoming less and less necessary as apps are becoming more “location-agnostic”; with the ability to deploy an app alongside its own instance of, say, NodeJS, we are running into less server-related constraints and will start to look at how our deployment environment can facilitate this type of web application deployment behavior.