BT

如何利用碎片时间提升技术认知与能力? 点击获取答案

Prose——Github所见即所得站点编辑器

| 作者 李湃 关注 0 他的粉丝 发布于 2012年7月9日. 估计阅读时间: 3 分钟 | CNUTCon 了解国内外一线大厂50+智能运维最新实践案例。

结合静态站点托管服务Github Pages与博客生成工具Jekyll,搭建博客站点,有着部署成本低、易于维护的特点。诚然,Jekyll可以与Github Pages无缝集成,专业人士通过pull request就可以发布内容,但不易用是其最大的问题。Prose是一个基于Github PagesJekyll内容编辑器,它的出现使得内容编辑更快、更方便。

开通Github Pages服务

Github项目首页,点击进入后台管理页面

图1:Github项目管理后台入口[1]

点击"Automatic Page Generator"按钮生成站点服务

 图2:Github项目页面生成器[1]

使用Markdown标记语言编辑站点内容,点击"Continue To Layouts"按钮

 图3:Github项目页面预览[1]

预览并发布

 图4:Github项目页面发布[1]

到这里,一个Github站点就生成了:http://{accountName}.github.com/{projectName}

使用Prose所见即所得的编辑特性

尝试Prose非常简单,首先通过Github账户身份验证,便可以导航到相应的站点

 图5:Prose验证页面[2]

着陆页会依次列举个人代码库(Repository)

 图6:Prose代码库列表[2]

选中之前开通Github Pages服务的代码库,可以浏览相应的文件以及创建新的文本文件

 图7:Prose代码库内容列表[2]

编辑内容的时候,Prose支持Markdown标签的高亮显示

 图8:Prose编辑器高亮特性[2]

任意时刻,都可以点击"Preview"按钮预览当前编辑的内容

 图9:Prose编辑器预览特性[2]

Prose附加特性

在菜单工具条点击"M"按钮,可以获取Markdown标签参考语法列表

 图10:Prose编辑器Markdown语法参考[2]

在菜单沟工具条点击"Metadata"按钮,可以看到文档的元数据以YAML的格式展现

 图11:Prose编辑器元数据特性[2]

Prose项目的架构特点与展望

Prose的架构实现是以BackboneJekyll为基础,应用托管在Github上,浏览器端直接与GitHub API交互。鉴于浏览器端无法直接与Github通过OAuth交互,服务器后端处理用户身份的验证,具体的实现可参照Gatekeeper

感兴趣的读者朋友既可以选择Prose作为Github项目博客的内容编辑器,又可以参与Prose项目的建设(Prose完全基于BSD开源协议),搭建本地开发环境请参照http://prose.io/help/internals.html

引用

[1] https://help.github.com/articles/creating-pages-with-the-automatic-generator

[2] http://developmentseed.org/blog/2012/june/25/prose-a-content-editor-for-github/

评价本文

专业度
风格

您好,朋友!

您需要 注册一个InfoQ账号 或者 才能进行评论。在您完成注册后还需要进行一些设置。

获得来自InfoQ的更多体验。

告诉我们您的想法

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

确实挺好用 by kun qin

确实挺好用

Re: 确实挺好用 by kun qin

1、如何用这玩意编辑图文并茂的 文档?
2、如何用其中一页编辑成其他页面的目录?

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

2 讨论

登陆InfoQ,与你最关心的话题互动。


找回密码....

Follow

关注你最喜爱的话题和作者

快速浏览网站内你所感兴趣话题的精选内容。

Like

内容自由定制

选择想要阅读的主题和喜爱的作者定制自己的新闻源。

Notifications

获取更新

设置通知机制以获取内容更新对您而言是否重要

BT