使用 Jekyll + Github Pages 搭建个人网站 | 数盟社区

前段时间,朋友问我如何高大上地展现个人作品。既然要求高大上,无外乎易传播、体验好、摒除纸媒,那就以线上的方式将自己的作品丢给面试官呗(朋友在求职)。我向她推荐了 github pages,一来无需购买服务器及域名,二则因为按照她的需求一个静态站点足矣。本文算是为朋友量身打造,比较适合小白食用,介绍了如何使用静态站点生成工具 jekyll 及 github 服务器搭建个人网站。大神请飘过但不反对批评指正,万分感谢。

一、创建 github 账号

若尚未申请 github 账号,请移驾此处进行注册。

github 用户名是可以修改的:

若执行上述操作后发现用户名仍未变更,其原因多半是该用户名已被占用(提示信息不明显,以致很多人不明修改失败的原因)。

二、新建仓库

使用 github 托管个人网站时,所对应仓库的命名是有规则的:___[github 用户名].github.io___。例如本人的用户名为 sunmengyuan,那么我的个人网站所对应的仓库名为 sunmengyuan.github.io。

下面,开始创建新仓库:

最后,将项目克隆至本地:

三、搭建个人网站

github 有许多模板主题可供选择,相关代码可自动生成:

但本人更倾向于自行搭建模板:一是因为与其改别人的不如自己写;二是为了令自己的网站更符合个人审美;三是因为作为一枚傲娇的前端工程师套用别人的模板实在说不过去。

关于 jekyll

jekyll 是一种静态站点生成工具,它可以使发表文章的过程简化为添加并撰写一篇 markdown 文档。

下面,___以本人的个人网站为例___,简单介绍 jekyll 的使用方法,更多内容请参阅官方文档

目录结构如下:_layouts 内的文件为骨架模板;_posts 内的 markdown 文件会转化为我们所需发表的文章;assets 含一些静态资源文件;views 包含站点内的所有页面;_config.yml 为配置文件。

关于 jekyll 开发环境

为何需要开启 jekyll 服务?一是使 jekyll 可自动编译文件从而生成静态站点;二是方便在开发环境预览修改效果。

注意事项:

jekyll 服务的启动应在含 _config.yml 文件的目录下。

启动 jekyll 服务时若提示含未安装插件,请查看 _config.yml 文件中的 gems 配置项并将所需插件一一安装。

注:转载文章均来自于公开网络,仅供学习使用,不会用于任何商业用途,如果侵犯到原作者的权益,请您与我们联系删除或者授权事宜,联系邮箱:contact@dataunion.org。转载数盟网站文章请注明原文章作者,否则产生的任何版权纠纷与数盟无关。
期待你一针见血的评论,Come on!

不用想啦,马上 "登录"  发表自已的想法.