A Little Technical Overview

I have finally gotten around to implementing a blog for my website. I have been itching to start a blog for a while, since I’ve always enjoyed reading the blogs of fellow UW students.

For my first blog post, I wanted to highlight the journey of how my website and blog came to be (though it is still definitely a work in progress).

Static Content

My website is hosted on GitHub, which worked well for my initial fully static single-page site from a year ago, but the lack of a back-end made implementing a blog seem like a daunting task.

For personal blogs/websites, a popular choice is to use Jekyll and just push static blog posts into the GitHub repository. But I wanted to try to make something a little more dynamic, and also wanted to put my AngularJS knowledge to use, so I am currently experimenting with an alternative solution…

dynamic content

Since I cannot have a back-end with my website on GitHub, I instead put all my content on WordPress and then make HTTP requests to their public API to pull posts to display on my website. This way, I have one HTML file which is a template for how my posts should be displayed, and then the content is dynamically pulled from WordPress depending on the post ID selected by the user (In a way, think of WordPress as my back-end).

A snippet of my Angular module which gets the posts:

angular.module('blogLoaderApp', ['ngResource', 'ngSanitize'])
  .controller('BlogController', function($scope, $http, $window) {

    $http.get(
        'https://public-api.wordpress.com/rest/v1.1/sites/angelwgao.wordpress.com/posts/'
    ).success(function(data){
        $scope.blogPosts = data.posts;
    });

});

By no means is this solution perfect. I am still figuring out all the nooks and crevices of this slightly unconventional implementation.
Some things that concern me are:

1. Disqus Comments

Disqus usually creates/grabs threads depending on the unique URL on which the discussion page is rendering. But since all my posts have the same base URL, with just a different parameter passed in (www.angelgao.com/post.html#?id={id}), I currently cannot have different threads per blog post. It is something I am currently looking into, and hopefully can be fixed with config variables.

2. SEO

Since the content of my blog are dynamically pulled from my WordPress blog and do not belong to my website itself, any Google search for the content will not lead to my website.

3. Filtering Posts

It will be a bit more work for me to implement a filtering feature on my website so that users can filter my blog posts with certain tags or categories.

future plans

I will start to tackle the concerning issues listed above, and through the investigations, the structure of my website could still change. But regardless of whether I stick with this solution, I have learned a lot, and had a lot of fun so far. One thing’s for sure, I will continue to experiment, continue to blog, and continue to keep you updated :).

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s