0%

A first hello

 这是我的第一篇使用hexo + markdown写成的博文。这个博客主要用来记录关于计算机的个人心得,如有侵权不足请指正。以下为 Q & A环节

Q & A:

Why write blogs?

Wikipedia 上关于blog的介绍是这样的:

博客(英语:Blog,为Web Log的混成词),意指log on the web意即在网络上纪录,是一种由个人管理、张贴新的文章、图片或视频的网站或在线日记,用来纪录、抒发情感或分享信息。博客上的文章通常根据张贴时间(Chronological Order),以倒序方式由新到旧排列。

我写博客的初衷在于系统总结经验知识和共享。一直订阅Study Hacks Blog,作者写的很多博文都给予了我很大的启发。同时,我在应用他的一些方法的时候,意识到光是碎片化的知识收集是不够的(如各种笔记软件),最终还是要用自己的大脑和语言组织知识之间的联系。Blog作为一种电子日志工具,具备可搜索性和完善的标签分类系统,同时容易二次编辑整理,且易于分享,因而成为了我的选择。

什么是markdown?

关于markdown的定义,Wikipedia 上面是这样写的

Markdown 是一种轻量级标记语言,创始人为約翰·格魯伯(John Gruber)。它允许人们
使用易读易写的纯文本格式编写文档,然后转换成有效的XHTML(或者HTML)文档。这种
语言吸收了很多在电子邮件中已有的纯文本标记的特性。

Github的官方介绍markdown的页面 Mastering Markdown 上面则是这样说的:

Markdown is a way to style text on the web. You control the display of the document; formatting words as bold or italic, adding images, and creating lists are just a few of the things we can do with Markdown. Mostly, Markdown is just regular text with a few non-alphabetic characters thrown in, like # or * .

下面用一组动态图来演示使用markdown的两个简单例子(编辑工具:atom+markdown-preview插件):

  • 设置文字加粗和斜体

    It’s vey easy to make some words bold and other words italic with Markdown.

  • 文本引用

    As Kanye West said:

    we are living the future,
    so the present is our past.

为什么使用markdown 写博客?

在我这三天的连续使用摸索看来,使用markdown写作有以下这些好处:

markdown 是一种标记式语言。

上手markdown非常容易,在记住几个基本的格式记号之后,你就可以完全不 用管最终格式问题,而只需要专注于文章的内容,页面排版渲染则交给css负责,实现排版与内容相脱离,可以称得上是“穷人版的LaTeX”。

类似于org-mode 的大纲模式

习惯了使用org-mode做gtd之后,我写作之前都习惯列出大的提纲和二级或者更低级标题,在必要的标题之下列出清单,然后再一步一步完善各级标题,而不是追求之前的一气呵成,从而避免了完美主义带来的拖延症,同时标题的次序权级可以很方便地调整,使得内容也更加有逻辑性。将日常中想到的要点用Google Keep随身记录在TODO list里面,然后使用markdown的大纲慢慢完善,我认为这样的一套工具效率很高,而且distraction-free.

足够轻量

使用者并不需要额外的编程语言基础或者弄懂HTML语言的细节,只需要掌握基本的几个用法就可以使用大部分的功能。另外也不需要配置语言环境,很多在线网站如简书,github之类的可以做到即时预览。

纯文本格式,编辑工具多、跨平台。

不同于Word 的docx格式,markdown文档是纯文本格式的,也就意味着你并不会担心类似于word 2003/2010/2016 创建的文档打开或者编辑的效果不同的问题,同时也不存在wps打开word文档不兼容的情况。你完全可以使用你喜爱的编辑器编辑md文档而不用担心无法打开或者windows下创建的文档Linux下无法继续编辑。因此markdown文档的编辑器有很多,小到windows自带的记事本,大到重型IDE都可以。下面是几个不同编辑器的例子:

  • Vim:vim安装插件之后,可以做到一遍用vim写md,一边同步调用chrome查看渲染效果,做到”所写即所见“ vim-instant-markdown

    具体的安装使用方法见项目主页 markdown-preview.vim

  • Emacs: Spacemacs配置好markdown layer之后,语法高亮很漂亮

  • Atom: 我安装的插件是markdown-scroll-sync + markdown-writer 实现同步滚动预览

  • vi, nano, etc

说了这么多优点,有哪些坑?

markdown 有很多变体flavour.

引用一个github项目整理的Markdown Flavours 列表:

A list of Markdown flavors in alphabetical order.

  • CriticMarkup
  • Discount
  • Ghost’s Markdown/Haunted Markdown
  • GitHub Flavored Markdown
  • GitLab Flavored Markdown (with login)
  • Haroopad Flavored Markdown
  • iA Writer’s Markdown
  • Kramdown
  • Leanpub Flavored Markdown
  • Litedown
  • Lunamark
  • Madoko
  • Markdown
  • Markdown 2
  • Markdown Extra
  • Markdown-it
  • Markua

不同的Flavour意味着markdown的语法在不同的编辑平台上可能会有细微的差别

markdown 并不能很方便地编辑表格或者复杂的流程图

markdown 还是更适合文字较多的语境,对于有需要各种流程图加可视化数据展示的,还是老老实实地使用word嵌套excel表格吧。

Why hexo?

Hexo 是一个基于Node.js开发的博客框架,引用“不如”的博文简绍:

hexo出自台湾大学生tommy351之手,是一个基于Node.js的静态博客程序,其编译上百篇文字只需要几秒。hexo生成的静态网页可以直接放到GitHub Pages,BAE,SAE等平台上。

由于hexo社区有相当多的中文用户,因此使用hexo写博客有如下好处:

hexo 容易部署,插件多

使用npm 可以很方便地安装各种插件,我目前用到的有两个

  • hexo-qiniu-sync: 参考项目主页Hexo七牛同步插件,在hexo主目录下运行命令安装

    1
    $ npm install hexo-qiniu-sync --save

    添加插件配置信息到_config.yml 文件中,在这里需要注意,与官方的README.md文档不同,你需要注释掉最初的两行:

    1
    2
    plugins:
    — hexo-qiniu-sync

    否则会覆盖掉hexo 本身的 hexo server 命令

  • hexo-deployer-git: 在hexo主目录下执行命令安装

    1
    $ npm install hexo-deployer-git --save

    配置好git用户名设置,ssh-key 就可以实现hexo d 一键部署到github

主题丰富

我的博客使用的是github上star数比较多的 hexo-theme-next, 主题的作者也写过一个关于git的在线教程网页:Pro Git, 值得一看。安装主题很简单,官方文档里有详细说明,这里扼要介绍一下:

  • 下载主题. 在hexo主目录下打开终端,使用git checkout 代码:

    1
    2
    $ cd your-hexo-site
    $ git clone https://github.com/iissnan/hexo-theme-next themes/next
  • 启用配置主题. 编辑hexo主目录下的站点配置文件_config.yml , 查找theme字段并设置为next

    1
    2
    ## Themes: https://hexo.io/themes/
    theme: next

    配置站点语言

    1
    2
    3
     # Site
    language: zh-Hans
    timezone: Asia/Shanghai

社区大

有什么问题一般都可以google解决或者是在github上搜索有无相似的issue.

怎样插入图片?

markdown插入图片的语法的一个例子是

1
![Image of Yaktocat](https://octodex.github.com/images/yaktocat.png)

最终的效果是Image of Yaktocat

由于github上的免费账户有存储空间限制,我选择了使用图床插入图片。

  • 选择图床

    1. 七牛 Hexo七牛同步插件. 注册七牛账户完成实名制认证之后就会有10G的免费存储空间。

    2. chrome插件-微博图床:登录微博账号后就可以在chrome内直接上传,同时生成markdown外链

    3. vps自建:这个应该是最具有定制性的方案了。

参考链接

  1. Learning-Markdown (Markdown 入门参考)
  2. vim安装markdown插件
  3. 使用七牛作为github博客的图床
  4. hexo 编辑器推荐
  5. Markdown Flavors
  6. 知乎上面的问答:有哪些好看的 Hexo 主题?