Why building bloggie.io?

It all begins when I tried to start my own technical blog.

A few months back, I gave a presentation at work about Android Tips (I'm an Android Engineer). My team mates loved it, they ask me if I can share it on a blog or somewhere, they want to refer to it.

In fact, I always think about starting an active blog account, but I always wonder if anyone would want to read what I write.

Now that my team mates are requesting, I’m all pumped up to do it!

Which platform should I choose?

I started looking for a suitable blog platform to share my post about Android Tips.

I've always read things on medium.com. So I started off with Medium, it's great but making code snippet and syntax highlight is harder than I imagined. I then tried wordpress, ghost and github pages, but they don't have author-reader matching system.

I start looking again.

I found qiita.com and jianshu.com, which are great but one is in Japanese, and another is in Chinese.

Then I start to think...

hmm... I wonder...

what if... I create my own one?

We can have all those features that might be deemed too complex in other platforms. To name a few: Syntax highlight, code snippet, side-by-side rendering editor, dynamic scrolling Table of Content, include a block from jsfiddle, flow chart creation tool, simple drawing tool, or even autodraw tool in the further future.

We can have some funny ones too: easy search for memes or emojis.

We can have different sections catering for various purposes. We can have explained like I'm five section, serious discussion section, video tutorials, developer's life section where we post about my cat , or your vacation trip to the Okinawa Island .

How nice if we have a blog platform crafted for developers?

As a result, I started building bloggie.io with Piao 3 months ago. This post you are reading right now is created by the Editor we've created.

My Imaginary blog platform for developers

To better understand what we are building, we ask ourselves what we personally want, and we made a list of them to help ourselves visualize.

Markdown Editor

Markdown is easy to understand and widely used by developers. It is just plain text and can be saved to any place. The technology is stable and there are many libraries with many features out at our disposal.

Syntax highlight

A good syntax highlight can improve readability of any code snippet.

Drawing tool

Picture speaks a thousand words. In many cases, a drawing can explain a concept way better than words. It will be great to have a drawing tool built in.

Filenames in the markdown

Let's say we want to talk about how to refactor this piece of file:

class Animal {}
class Dog extends Animal {}

We want to refactor this into 2 files, it would be great if I can specify the filenames:

Now, I can reference to it and say, you should refactor Dog into Dog.java.

Tab view

In some cases, we need to show a few files together. Let's say I have a main build file main.build , that will be calling to another 2 child build files: child1.build & child2.build. Usually this is how I will do it, with 3 code blocks:

#include 'child1.build'
#include 'child2.build'

// do stuff

// do stuff

// do stuff

Imagine each file having 10 lines, reading each file will involve some repeated up & down scrolling.

I think Tab View will be a good candidate here

Flow chart creation

When we are describing the flow of a piece of code, it's much easier to understand with Flow Chart.

Consider this:

onCreate() runs before onStart()
onStart() runs after onCreate() but
before onResume() and it runs after onRestart()

It's pretty hard to visualize right it, but if it's shown as a Flow Chart:

It's much easier to understand!

Without having to find a flow chart tool, draw the flow chart, and then export it, and upload as an image, it will be great to have a flow chart tool built in.

Post series

A complex ideas need to be broken down into smaller ones to be well comprehended. For example, a series of tutorials for learning Ruby language:

• Learn Ruby: Part I
• Learn Ruby: Part II
• Learn Ruby: Part III

Then, at the beginning of each posts, we'll have to create a bunch of links to chain all the other parts together.

For example, you are in Part II:

--- Learn Ruby: Part I
 --- Learn Ruby: Part II <--- You are at here
 --- Learn Ruby: Part III

// actual Part II content begins..

It will be better to have a configuration for doing this, then you'll have something like this:

Summary

I can go on and on with many other features that I want, but before building everything, I want to know if this is what other developers would enjoy. So we started out building a working website, and started to use it ourselves. Feel free to sign up and try it out yourself!