About

About me

Hi, I am XuRui Yan. My chinese name is 晏旭瑞. I am now working in Beijing as a Python developer aimed at high-performance web server. I received a Bachelor's degree in Computer Science and Technology from Beihang University.

Contact Me

For short messages and quick response, you can contact me via QQ. Feel free to use the comment section below every page and I'll reply you as soon as possible.

About this Site

What do I write?

This is my personal website and blog where I write down my thoughts, technical experiences, solutions to problems and learning notes that I would like to share.

  • All articles are my original unless I state it clearly
  • Every article takes me more than 10 hours to finish

All technical details behind this website

This is a static site generated by Pelican: A Static Site Generator, Powered by Python and hosted on bandwagonhost's VPS using NGINX.

Theme

The frontend design was initially done by Abdel Raoof Olakara for Jekyll and the theme is freely available on Github: olakara/JekyllMetro. I forked it and made a lot of modifications before applying to pelican. Here are a list of libraries used in this website:

PhotoSwipe

A popular image gallery used to zoom and swipe images on both desktop and mobile devices.

This is a 500px-like justified image grid layout which can present images in their original aspect ratio without cropping. Another common layout is Pinterest-like cascading/fluid grid layout also know as masonry style. Examples can be seen in Masonry, Metro, and Justify layout modes

Code Highlight

CodeHilite adds hightlight for code blocks using Pygments. This extension is included in the standard Python Markdown library. Let me explain it in a detailed way.

Like any Markdown interpreter, Python Markdown can convert print('hello') into

print('hello')

We need two steps to achieve highlighting:

  1. set different classes for all components in the code block This is done be codehilite extension

This extension also enables us to specify the language.

The result of

print('hello')

is

        print('hello')
    

I prefer to fenced code block which is supported on GitHub so we still need markdown.extensions.fenced_code to support this syntax.

markdown.markdownFromFile('a.txt', extensions=['markdown.extensions.fenced_code', 'markdown.extensions.fenced_code'])
The third party extensions pymdownx.highlight plus pymdownx.superfences can do the same thing.

  1. import css rules to define styles for different classes Pygments can generate CSS stylesheet of different themes for all CSS classes mentioned above.

Install Pygments library and run the following command:

pygmentize -S monokai -f html -a .highlight > styles.css
-S specify the theme to be used. -a sets CSS class name for the wrapper
tag. Defaults to codehilite.

Then link this CSS file in the head of the HTML file.

Code highlighting can also be done by JavaScript highlighters such as highlight.js instead of CSS stylesheet produced by Pygments. Codehilite will generate HTML snippet like below if use_pygments is turned off.

print('hello')

HTTPS


qq email facebook github
© 2018 - 晏旭瑞. All rights reserved
Built using pelican