Content Management System

Tech Stack

Frontend: JavaScript, React, Sass, webpack, CKEditor, Grunt
Backend: Ruby, Rails, Sidekiq, Liquid, Postfix
Database: MariaDB, Redis, Memcached
Web Server: NGINX
DevOps: Chef, Capistrano
Sass: Mackerel

(In Evaluation Phase)
I made chef recipes for most middleware in the following tech stack.
Frontend: JavaScript, AngularJS, Bower, gulp.js
Backend: PHP, Zend Framework, ActiveMQ, Python, Gensim
Database: Elasticsearch
Load Balancer: LVS, Keepalived
CDN: Varnish
NFS: Gluster
DevOps: Zabbix, Munin, Nagios, Kibana, Logstash, Fluentd

Backstory

Back in university, I built static websites and wrote blog posts on blog services. I felt happy when some people visited my websites, read my posts, and left comments. Interaction with other people on the blogs fascinated me. I could get a strong feeling of how powerful Web 2.0 was. Then I started building a simple blog system using PHP and MySQL.

I had such a joyful moment when I finished building it. At the same time, I wished I could have more skills to make a better system. I decided to practice programming seriously.

After the experience of some jobs and side projects, I wanted to see how far I have progressed in practicing programming. I built my ideal CMS that I could not have built during my time as a university student.

Most Challenging Parts

There were two most challenging parts.

Page Renderer

I needed an HTML renderer to parse custom HTML tags with arbitrary variables and convert them to standard HTML tags.

I use Nokogiri as the parser. I could not integrate it into the system straight away. With lots of attempts, I managed to work it out. For processing the variables, I first used the Rails view engine. It worked fine and it seemed all good.  

A short while later, I had a hunch that the Rails view engine could run any Rails scripts. My guess was right and I needed to fix it. I got some ideas for the implementation, and it seemed like a lot to do.  Luckily, I could find Liquid as a suitable template engine for the project.

After lots of struggling moments, I finally could make the Page Renderer. I can not stop feeling respect for those who are working on text parsers.

CKEditor

CKEditor has a large and intricate codebase. It took me a while to understand how it works. Although its document was helpful, it did not cover everything I needed. I needed to read the source code and debug it many times for making plugins.

CKEditor 4 is written in ES5. Working with a large ES5 codebase was quite challenging.