作者:小傅哥
博客:https://bugstack.cn
积淀、分享、成长,让本人和别人都能有所播种!????
一、前言
压测了,小傅哥一天能搭 4 个博客!
好学、乐学、博学、恒学、会学和用学,学以致用。一起学习成长的很多同好以及我本人,都是同样喜爱折腾的人。
最早大家都喜爱倒腾本人的 QQ 空间,装修的各式各样,可那夸耀。但究竟这个 QQ 空间外面,还有很多货色不能让本人随便摆弄。不晓得是不是此类好奇和喜好,让很多人走上了编程开发的路线。
就折腾博客而言,在大学开始就不停的折腾。从一个网页能被宿舍人拜访、被校友拜访、被家人看到,那个兴奋劲还是十足的。哪怕是中午也是一遍遍的折腾写着 html,尽管丑了吧唧的!
最近有不少粉丝问小傅哥,本人也想搭建个本人的博客零碎写写文章,但不晓得怎么弄。正好小傅哥也的确折腾过各种博客的搭建,理解一些坑坑洼洼,算是给前面的司机开开路。
本文次要向大家介绍:
- 4 类动态博客,hexo、docsify、jekyll、vuepress,的差别和特点
- 在 GitPage 上部署本人的博客
- 独立域名 + 集体服务器,部署博客
- 另外小傅哥把这些博客脚手架对立放到 Github 仓库,不便大家应用时候能够更不便。关注公众号:bugstack 虫洞栈,回复:博客零碎
有了这些参考,大家就能够抉择适宜本人的博客零碎了,开心的写博客。
二、你要筹备的货色
- 简略记录:Github 账号或者 Gitee 账号,应用两家的收费动态网页托管服务即可。
- 绑定域名:如果你想通过本人的域名拜访博客,Github 与 Gitee 都反对配置,但 Gitee 须要付费。不过 Gitee 对于国内的访问速度要好一些。
- 访问速度 :当你的博客想被更多人拜访并且也在意网页的关上速度和体验,那么就须要一个独立的服务器和域名了。 这个服务器能够部署动态网页即可
综上,是每一个人建博客的不同目标和须要的内容,按需抉择即可。
另外,GitPage 配置参考:https://docsify.js.org/#/zh-cn/deploy 在 Github 的配置中,能够抉择根目录和 docs 两个文件夹,作为动态博客的仓库。所以在抉择上面四类博客中,都是把 docs 文件夹预留进去,方便使用。
三、4 种博客的搭建
- 小傅哥把四类比拟罕用的博客,源码局部放到这个集中的仓库,不便大家在应用的时候间接克隆走。
- 对于这四类博客的建设,会在当前陆续的欠缺内容。如果你感兴趣也能够参加到我的项目中。
- 下载地址:https://github.com/BlogGuide
1. hexo
- 介绍:Hexo 是一个疾速、简洁且高效的博客框架。Hexo 应用 Markdown(或其余渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成动态网页。
- 官网:https://hexo.bootcss.com
- 案例:http://hexo.blog.itedus.cn
- 源码 :https://github.com/BlogGuide/hexo.blog.github.io – 克隆到本人的仓库
- 命令:
npm install hexo-cli -g
hexo init blog
cd blog
npm install
hexo generate # 生成
hexo server # 启动服务
-
特点:
- hexo 的主题特地多,选择性很高
- 须要本地编译后,把编译文件推送到 Github
-
其余:
- 因为须要编译和推送,如果只是想简略的写博客,不举荐应用。
- 但如果想把动态博客部署到集体的服务器,那么就非常适合了。
2. docsify
- 介绍:docsify 能够疾速帮你生成文档网站。不同于 GitBook、Hexo 的中央是它不会生成动态的
.html
文件,所有转换工作都是在运行时。如果你想要开始应用它,只须要创立一个index.html
就能够开始编写文档并间接部署在 GitHub Pages。 - 官网:https://docsify.js.org/#/zh-cn
- 案例:http://docsify.blog.itedus.cn
- 源码 :https://github.com/BlogGuide/docsify.blog.github.io – 克隆到本人的仓库
- 命令:
npm i docsify-cli -g # 全局疾速装置
docsify init ./docs # 初始化我的项目
docsify serve docs # 本地预览
- 特点:非常简单、洁净,间接把工程文件和 md 博客推送到 Github 即可,不须要本地保护编译。
3. jekyll
- 介绍:一个简略的,基于疏导的主题。特地是对于那些喜爱在网站上展现本人的我的项目并喜爱做笔记的开发人员。还有一些神奇的特色须要发现。
- 官网:https://github.com/DONGChuan/Yummy-Jekyll
- 案例:http://jekyll.blog.itedus.cn
- 源码 :https://github.com/BlogGuide/jekyll.blog.github.io – 克隆到本人的仓库
- 命令:
Fork code and clone
Run bower install to install all dependencies in bower.json
Run bundle install to install all dependencies in Gemfile
Update _config.yml with your own settings.
Add posts in /_posts
Commit to your own Username.github.io repository.
Then come back to star this theme!
- 特点:这个博客的主题其实有点重,在写博客的时候须要人工保护的内容较多。但同样这个主题有一个益处就是如果应用 Github,那么就间接把我的项目和博客传到 Github 即可,不须要本地编译。
4. vuepress
- 介绍:VuePress 由两局部组成:第一局部是一个极简动态网站生成器 (opens new window),它蕴含由 Vue 驱动的主题零碎和插件 API,另一个局部是为书写技术文档而优化的默认主题,它的诞生初衷是为了反对 Vue 及其子项目的文档需要。
- 官网:https://vuepress.vuejs.org/zh
- 案例:http://vuepress.blog.itedus.cn
- 源码 :https://github.com/BlogGuide/vuepress.blog.github.io – 克隆到本人的仓库
- 命令:
npm install -g vuepress # 装置
vuepress build docs # 构建,生成 html,能够用于部署
vuepress dev docs # 启动,http://localhost:8080/
- 特点 :基于 vue 实现的博客,性能很多适宜扩大。很适宜部署到集体独立的服务器,如果是部署到 Github,能够参考 源码,在一个工程中提供 docs 用于寄存生成的网页,这样在 Github 就不须要再保护额定的分支。
四、部署到本人的服务器
- 博客:vuepress
- 软件:Idea、ftp[可选]
- 环境:域名、备案、SSL 证书、服务器
vuepress 的博客我的项目放 IDEA 中关上和日常保护就能够了,而且 IDEA 只提供了 FTP 的性能,也能够不便上传服务到近程服务器。
对于域名和服务器等须要购买,另外还须要备案能力失常应用。如果你想域名有一个小锁头的平安提醒,则须要 ssl 证书,个别能够收费获取。
其实小傅哥曾经有一个 bugstack.cn 博客,本次是又申请了一个新的域名 itedus.cn 想着再搭建一个玩玩,折腾!
1. IDEA 配置 FTP
在 IDEA 的菜单栏上,Tools 中有一个 Deployment 的选项,能够配置 FTP 以及其余 SFTP。
- Host:你购买的服务器都会提供 FTP 性能,在外面有 host 地址
- User name:用户名
- Password:明码
- 配置实现后,在 Deployment 关上的菜单选项中,会有一个
Browse Remote Host
关上当前能够在 IDEA 中看到了。
2. 上传动态网页
- 到这就能够间接上传了你的动态网页到服务器了
- 其实你还能够基于 Github 的 Webhooks 配置主动推送,但整体配置和实现的内容比拟多
五、总结
- 与 CSDN、掘金、思否、开源中国等提供的博客相比,本人保护的博客开发还是须要一些工夫精力和经营老本的。但如果想给本人的常识一个实际的机会,就值得折腾。
- hexo、docsify、jekyll、vuepress,四类博客各有本人的特点,有的须要编译上传,有的间接推送 Github 即可。但想有本人的域名和整体的体验,就须要购买服务器和备案域名。
- 本篇文章只为送给那些想折腾一下的搭档提供一些可实现的门路,但这条门路上如果你想真的搭出一个称心如意的博客,要搞的货色还很多。甚至你会像我一样折腾到公众号开发与博客联动等等,好!助力你做个喜爱折腾的人!
六、系列举荐
- 讲道理,只有你是一个爱折腾的程序员,毕业找工作真的不须要再花钱培训!
- 20 年 3 月 27 日,Github 被攻打。我的 GitPage 博客也挂了,紧急修复之路,也教会你搭建 Jekyll 博客!
- 为了省钱,我用 1 天工夫把 PHP 学了!
- 工作两年简历写成这样,谁要你呀!