An Angular Client for a WordPress site

January 20th, 2017

I coded up an Angular 1.5 app that shows the posts from my WordPress blog. It fetches post data from this site’s Rest API.

A proof-of-concept is here: Cherrytree.

The repo is on my Github: Topheavy-Angular.

It shows a ‘default’ listing of posts on the front page, which is equivalent to the default WordPress loop. I has single post views with the same URL structure as my WordPress permalinks. And it has category views that you can see if you hit the links in the header, for ‘books’ and ‘wordpress’ categories.

I like the faux permalinks, which mimic the permalinks on this WordPress site (domain/year/month/slug). They key to this is to add year and month properties to each post object when you fetch collections of posts. Then you can add these fields to the state for single posts.

Getting collections of posts in a category also works by slug. For these I used kadamwhite’s method. Basically you look up the ID that is attached to a category slug, and then fetch the posts with the ID. I thought this would be a big slow-down, but it doesn’t seem to be a problem.

If anyone wants to clone it, go ahead. You need to do a NPM install first, to get the dependencies. Then gulp build and gulp serve will get you going. I used fountainjs.io for a boilerplate.

Leave a Reply

Your email address will not be published. Required fields are marked *