Last Tuesday, I made up my mind to rewrite my blog from scratch. I lost my hope to make my Wordpress blog compatible with the GDPR. So after almost six years, it's time to kiss Wordpress goodbye. It's time to eat my own dog food. It's time to create a blog running on Angular!
I started the project Wednesday, so I had only two days. To my surprise, I managed to finish working version of the blog by Thursday midnight, when the GDPR came into effect. Of course, that version hastily cobbled together. In other words, it was a bit buggy, not to mention the horrible design of the GDPR notice. Nonetheless, I'm impressed by the level of productivity Angular gives you.
Why abandon Wordpress?
On the one hand, I often felt a bit constricted by the Wordpress framework. It's great, especially if you're ready to go all the way down to PHP. You can use Wordpress as a framework to do anything.
However, I configured my blog to be, well, just a blog. Basically, writing texts was all I could do. As a programmer, I often want to be more than that. Plus, the blog began to become slow, and it became increasingly difficult to keep the performance high.
When GDPR popped up (as suddenly as Christmas - long since announced, but each year it comes as a surprise), I become aware that I have to ask my readers (that's you) a long list of questions:
- Is it OK that I count your visit with Piwik? Currently, it's not clear what the courts make of it. Unfortunately, generally speaking, the idea of the GDPR is to ask you first. I don't believe there are many people you actively agree to be tracked. In other words, the visitor counter is useless. My first decision was to get rid of it.
- Do you agree to fetch fonts, CSS files, and JavaScript from a CDN? That's one of the best practices of the internet, but in the light of GDPR, that may be a thing of the past soon. The browser sends some information about you to the CDN. There's no way to avoid that. Moreover, there's no way to know what the CDN provider does with the data.
- Is it OK that I process your data with Wordfence? That's a Wordpress plugin caring about internet security. It prevents your block against hackers trying to upload malware or running a brute force attack to guess the admin password.
The problem is that Wordfence only works if it can store the IP address in a database. GDPR demands to ask the user for permission, and it's unlikely any hacker is ever going to grant this permission.
The Wordfence team insists they've found a way to solve this problem. However, I decided to err on the safe side. Among other things, an essential function of Wordfence is to send data home. They use this data to detect DDOS attacks. It's a great feature. The only problem is that it's not really compatible with the GDPR.
Actually, I never observed Wordfence or any of my plugins sending data anywhere, so maybe it's a feature reserved for the paid version. But again, I better safe than sorry.
Why choose Angular?
My idea was to create a static blog. Using pure HTML quickly proved to be cumbersome, so I used Angular as a more flexible alternative. This way, I eliminated the two principal attack vectors: The new blog doesn't use a database. There's no login page. Of course, attackers can still attack the blog with a DOS attack, or cause trouble in other ways. But, that's something they could do before, too.
As a side effect, there's no use for cookies. Remember, the visitor counter is gone. So the only use-case for a cookie is to hide the annoying GDPR message permanently. Maybe I'll add such a cookie later, but I'm going to observe the jurisdiction for a couple of weeks or months first.
Currently, the blog is as lightweight as can be. No cookies, no CDN, no database, no sending data to any third party.
What happened to the comments?
Maybe you've already noticed that the comments are gone.
One of the next updates of BeyondJava.net is going to add the comments left before the GDPR again.
However, I'm not sure if I'm going to add the comment function again. It requires a database, it's a popular attack vector, and it's data processing as defined by the GDPR. That opens a host of problems I'd like to avoid. Just drop me an email to leave a comment.
Crawling one's own blog
The rest of the article is a short "making of" story.
The first challenge was to extract my old articles from my blog. There are more than 350 articles, so it's obvious I had to write a program for it.
The first approach used a real crawler. A quick internet research showed me many crawlers, but for some reason, I preferred to use a programmatic approach. That also settled the question which language to choose. The second crawler I found and understood is a JavaScript library. So JavaScript it is.
Writing the crawler was merely a matter of a few lines of code. However, the HTML code doesn't contain all the information needed to render a blog, so I went on to read the 350 articles from the database, including the comments, the categories, and so on.
By the way, the crawler showed me the API of my blog. I wasn't aware there are some many URLs.
Formatting the articles nicely
Wordpress does a lot of formatting. Adding insult to injury, I use several plugins, generating even more formatting. The hard part of the project was to reverse-engineer this formatting.
It goes without saying I wrote a tool to do the formatting. I'm still using this tool. It allows me to write the text without adding all those HTML tags.
Along the way, I learned a lot about node.js programming. It's a pleasant experience, even if I didn't bother to set up the debugger.
Syntax highlighting
Over the years, I grew fond of the SyntaxHighlighter written by Alex Gorbatchev. Unfortunately, I didn't manage to make it work with Angular. I'm sure there's a way, but I didn't find out how to do it.
After a while, I decided to take a new approach. Prism is another popular syntax highlighter. I quickly found out there's a programmatic API. So I included Prism with my node.js tool formatted the text. Now the blog uses pre-formatted text. That adds to the file size but reduces the strain on the battery of your smartphone.
Creating an Angular version of the blog
The rest of the project was easy. Angular makes you very productive, so it took me one or two days to write the blog from scratch. I didn't want to modify the look and feel of the blog, so I simply used the CSS and JavaScript files of the Wordpress version.
Optimization
I was a bit shocked when I started to look at these files closely. My blog uses only a small fraction of the features of Wordpress and the Sydney theme. I started to separate the wheat from the chaff. That got my rid of most of this bloat.
So that's the current state of the art: the new version of the blog is up and running, and I've started to optimize it. It's already faster than the old blog. After the optimization, it might be even faster.
SEO optimization
There's just one catch: I'm not entirely sure if the Google crawler manages to read the new blog. When I test it using the webmaster tools, the crawler shows a mostly blank page. However, Google has announced to be able to crawl AJAX-driven pages and blogs, so I'm curious whether the new posts appear in the index during the next couple of days.
Wrapping it up
Maybe rewriting the blog from scratch was a bit excessive. However, now I'm 100% sure this blog complies with the GDPR. Plus, I can modify it much easier than before. As a side effect, I learned a lot about Angular and node.js. The developer productivity of these tools is astonishing.