{"data":{"post":{"title":"Hello, World!","subtitle":"","isPublished":true,"createdTime":"2019-02-05T00:00:00.000Z","lastModifiedTime":null,"license":null,"tags":[],"category":"Publication","file":{"childMdx":{"excerpt":"Hello, world! I haven't been writing blog posts for a long time. The reason why I had given\nup…","code":{"body":"function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nconst layoutProps = {};\nreturn class MDXContent extends React.Component {\n  constructor(props) {\n    super(props);\n    this.layout = null;\n  }\n\n  render() {\n    const _this$props = this.props,\n          {\n      components\n    } = _this$props,\n          props = _objectWithoutProperties(_this$props, [\"components\"]);\n\n    return React.createElement(MDXTag, {\n      name: \"wrapper\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Hello, world!`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `I haven't been writing blog posts for a long time. The reason why I had given\nup blogging is that currently there are no blog systems fulfill all my needs. I\ntried to get used to Medium. I love its reply system -- which guides people to\nwrite a new post instead of a simple comment -- actually this was what the world\nof blog used to be, but the render effects of code blocks sucks. Moreover, I'm a\nmulti-linguist, I want to write both in Chinese and English at the same time,\nand sometimes Japanese and German. But the quality of Chinese character's render\neffects on Medium doesn't match those of Latin script or even Japanese Kana.\nAfter 1 year of bearing such a torture of playing with mismatched product\nquality on Medium, finally I decided to implement my own.`), React.createElement(MDXTag, {\n      name: \"h2\",\n      components: components\n    }, `Jekyll and Abandoned`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Firstly, I chose Jekyll. But soon, I abandoned. Frankly, I don't like Ruby,\nwhich is the language implements Jekyll. I'm a Chinese grew up in Mainland\nChina. For one of the core concepts of Simplified Chinese and Ruby is both\n\"simplify for simplification\", and such a kind of simplification rule produces\nmany irregular cases which increases brain burden after all, thus I don't like\nboth. Ruby's grammar is highly irregular which is just like the strokes of\ncharacters is more irregular in Simplified Chinese than what they were in\nTraditional Chinese. You write less on the surface, but remember more and take\nmore time to understand what you written under the surface.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `There are more historical details I can tell in between China and Japan about\nhow simplification \"took over\" two countries, which one is the \"motherland\" of\nSimplified Chinese and the other Ruby's.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Japan got started to simplify the pronunciation system of Chinese characters\n(Kanji) in Meiji Restoration. Several decades later, 9 days after the foundation\nof the People's Republic of China, Japan announced the use of its new form of\nChinese characters -- Shinjitai (literally means \"new character form\"), which\nis just another approach to simplify Traditional Chinese.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `While Japan simplified the Chinese character's pronunciation system, it is\nimpossible for China. For there are already tons of homophonic words in Chinese,\nwhenever you are speaking Chinese or Japanese, the number of homophonic words\nwould dramatically increase after you did whatever simplification to the\npronunciation system. When speaking Japanese, you can get rid of those\nhomophonic Chinese words by \"falling back\" to native Japanese words or phonetic\ninterpreted words came from languages other than Chinese. But when speaking\nChinese, there are no \"fallback words\". Thus we don't simplify the pronunciation\nsystem of our language.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Thus the only simplification we did to our language is just the simplification\nto the form of characters. About ten years after the foundation of the People's\nRepublic of China, the central government announced to gradually replace the use\nof Traditional Chinese with Simplified Chinese.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Well, but the reason why I had abandoned Jekyll is not as complicated as the\nhistorical details I mentioned above. Just like other blog systems that I have\nused before, Jekyll doesn't fulfill all my needs. The user defined excerpt\nmarkup is awesome, but I also want shortcodes in WordPress. I had to write\nadditional codes to generate tags and category if I wanted to host it on GitHub\nPages.`), React.createElement(MDXTag, {\n      name: \"h2\",\n      components: components\n    }, `Zola and Abandoned`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Because I've been learning Rust for weeks when I decided to implement my own\nblog system, I also searched some blog frameworks written in Rust. Then I found\nZola.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Truth be told, Zola is a good book generator. Even you can use it to generate\ndocumentations and guides. But as a blog system, it fails.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `It was designed to be a single binary such that the extension of the system is\nextremely difficult. Because of its simplicity, it is the best choice if it hits\nall your needs and the only thing you have to do is to design a theme. But soon\nfails totally if one of your needs is out of its spec list.`), React.createElement(MDXTag, {\n      name: \"h2\",\n      components: components\n    }, `Gatsby.js and Determined`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Occasionally, I found Gatsby.js. Or say, the meet with Gatsby.js is my destiny.\nAfter trails of Jekyll and Zola, it no longer scares me that to take some time\non assessing a blog system by writing some trail codes with it.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Just after downloading the tutorial project and scratching with lines of code, I\ndecided to implement my own blog system with Gatsby.js.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Gatsby.js is built upon React.js and node, which I have never got touched with\nbefore. But picking up these two skills is quite simple. The expression is\nstraight and easy to understand. The concept behind Gatsby.js is more like\ndata-oriented programming. But it doesn't matter that if you don't know such a\nbuzz word. You can imagine that Gatsby.js works like a pipeline, and the only\nthing you have to do is just to \"hook-up\" on correct time and add your custom\ncontents.`), React.createElement(MDXTag, {\n      name: \"h2\",\n      components: components\n    }, `When MDX Met with Gatsby.js`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `After several days crawling on Gatsby.js community, I quickly found an awesome\nupgrade to traditional Markdown: MDX.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `MDX is JSX enhanced Markdown, which means you can insert JSX tags in Markdown\ndocuments and the framework would replace it with real React.js component on\nbehalf of you when rendering the document.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `This means I can implement a replacement of WordPress shortcodes with JSX tags\nand React.js component now. Some features like left/right float figures, charts\nand components out of current imagination can also be easily extended into the\nsystem now.`), React.createElement(MDXTag, {\n      name: \"h2\",\n      components: components\n    }, `Struggle with Gatsby.js`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `The perspective is beautiful but the road is frustrating.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Since the framework interprets MDX document in JavaScript, and the JavaScript\nescapes backslash (/) escaped tokens (which means interprets valid escaped\ntokens likes \"\\\\n\" into a real newline and invalid escaped tokens likes \"\\\\L\" into\n\"L\"), the first thing I have to do is to get the framework stopped doing that.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `For the framework converts the MDX document into Markdown AST firstly, and then\ninto MDX AST, this mis-interpretation can be corrected after Markdown AST\ngeneration by inserting a guard backslash before each backslash in the Markdown\nAST. The principal behind this is simple: Since the JavaScript blindly escapes\neverything after a backslash, so just get that backslash escaped.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `You may wonder that there are also escaped characters in Markdown grammar, what\nhappens to them when you blindly inserting a guard backslash before each existed\nbackslash?`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Well, the answer is simple: The escaped characters of the Markdown language in\nthe document have been escaped in the progress of converting MDX document into\nMarkdown AST, which means they are no longer escaped characters in the AST now,\nyou can safely do it on generated Markdown AST.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `After fixed the backslash issue, there were still many issues waiting for me.\nBut building a system with Gatsby.js is joyful.`), React.createElement(MDXTag, {\n      name: \"h2\",\n      components: components\n    }, `Stage of the Project`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `As I mentioned before, there are no blog systems fulfill all my needs. Does\nGatsby.js fulfill all my needs?`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Yes. Though there is not an out-of-box Gatsby.js project fulfills all my needs,\nbut building what I need is quite simple with Gatsby.js.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Currently this blog implements`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `A responsive design`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `Basic Markdown syntax support`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `Inline and block KaTex syntax support`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `Tags and category`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `Table-of-contents for sectioned posts`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `Creative Common 4.0 license claimer`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `RSS feed`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `But this is not the end. In the next stage the project would add support to:`), React.createElement(MDXTag, {\n      name: \"ul\",\n      components: components\n    }, React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `Webmention`)), React.createElement(MDXTag, {\n      name: \"li\",\n      components: components,\n      parentName: \"ul\"\n    }, React.createElement(MDXTag, {\n      name: \"p\",\n      components: components,\n      parentName: \"li\"\n    }, `\"Shortcode\" for major video sites`))), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `And the site would finally implement a beautiful render effect for Chinese\ncharacter and Latin script mixed documents which enables me to post in languages\nI intentionally want to.`), React.createElement(MDXTag, {\n      name: \"p\",\n      components: components\n    }, `Since I decided to build this site in a couple of weeks, I didn't ship a very\nmodern design. The appearance of the site is quit old school. But I have already\ngot a new design. Since refreshing the appearance of the site needs a lot of\ntime, it might be taken after half or one year.`));\n  }\n\n}\nMDXContent.isMDXComponent = true;","scope":""},"headings":[{"value":"Jekyll and Abandoned","depth":2},{"value":"Zola and Abandoned","depth":2},{"value":"Gatsby.js and Determined","depth":2},{"value":"When MDX Met with Gatsby.js","depth":2},{"value":"Struggle with Gatsby.js","depth":2},{"value":"Stage of the Project","depth":2}]}}},"earlierPostExcerpt":null,"laterPostExcerpt":{"slug":"/post/2019/03/a-story-of-implementing-aspect-oriented-programming-in-objective-c-and-swift-8b92","title":"A Story of Implementing Aspect-Oriented Programming in Objective-C and Swift","subtitle":"","createdTime":"2019-03-01T00:00:00.000Z","tags":["Swift","Objective-C","Aspect-Oriented Programming"],"category":"Programming","file":{"childMdx":{"excerpt":"Case Study: Intervening UIScrollView Instances's Pan Gesture Recognizer As we known,  UIScrollView  translates pan gesture signals into\n scrollViewDidXXX:  messages and sends to its delegate, most of the time\nyou only have to understand the relationships between the pan gesture\nsignals and the…"}}}},"pageContext":{"postId":"ddd97bb5-2ed3-509f-95d6-6b52f87716c7","earlierPostId":null,"laterPostId":"6711bea1-42f1-543e-bb9c-8740e10314f0"}}