上次有人留言说,技术博客是程序员的标配,但据我所知绝大部分技术同学到现在仍然没有自己的技术博客。原因有很多,有的是懒的写,有的是怕写不好,还有的是一直想憋个大招,幻想做到完美再发出来,结果一直胎死腹中。但其实更多程序员是不知道如何去搭建一个博客,其实如今搭建一个个人技术博客非常简单,其中最简单搭建方式莫属使用 GitHub Pages + Jekyll 了,我的博客就是使用这种技术。

GitHub Pages

Github Pages 是面向用户、组织和项目开放的公共静态页面搭建托管服务,站点可以被免费托管在 Github 上,你可以选择使用 Github Pages 默认提供的域名 github.io 或者自定义域名来发布站点。Github Pages 支持 自动利用 Jekyll 生成站点,也同样支持纯 HTML 文档,将你的 Jekyll 站点托管在 Github Pages 上是一个不错的选择。

使用 Github Pages 搭建博客有以下几个优点:

  • 完全免费,其中服务器、流量、域名什么的都需要管,完全零费用搭建一个技术博客
  • 写博客就是提交代码,让写作和编程的体验保持一致
  • 支持绑定自己的域名
  • 提供流行的网页主题模板

缺点也是有的:

  • 不支持动态内容,博客必须都是静态网页,一般会使用 Jekyll 来构建内容。
  • 博客不能被百度索引,因 Github 和百度有过节,所以 Github 就把百度给屏蔽了。
  • 仓库空间不大于1G
  • 每个月的流量不超过100G
  • 每小时更新不超过 10 次

Github Pages 使用 Jekyll 来构建内容,那么 Jekyll 是什么呢?

Jekyll 介绍

Jekyll 是一个简单的博客形态的静态站点生产机器。它有一个模版目录,其中包含原始文本格式的文档,通过一个转换器(如 Markdown)和我们的 Liquid 渲染器转化成一个完整的可发布的静态网站,你可以发布在任何你喜爱的服务器上。Jekyll 也可以运行在 GitHub Page 上,也就是说,你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站,而且是完全免费的。

但如果我们只是在 GitHub 上面使用的话,到不需要知道 Jekyll 的语法,一般 Github 会自动将我们写的 Markdown 文件转换成静态页面。使用 Jekyll 需要使用 Markdown 语法来写你的文章,不过 Markdown 语法非常简单,做为程序员来讲基本上两三天就掌握了,大家也可以参考这篇文章:markdown 使用总结。

给大家分享一些 Jekyll 主题,这个网站下有很多 jekyllthemes.org/ 主题,大家可以根据自己的爱好去选择博客主题。

我的个人博客

我的博客经过了三个阶段,第一个阶段,完全依托于使用 GitHub Pages 来构建;第二个阶段,将博客托管于国外的一个服务商;第三个阶段,服务器迁移回到国内、域名备案。之前也写过几篇关于技术博客的文章,如下:

  • 千里追踪博客之殇
  • 历时25天,我的博客(www.ityouknow.com)终于又活了过来
  • 技术博客那些事儿

使用 Github Pages + Jekyll 构建一个技术博客很简单,基本上步骤就是网上找一个自己喜欢的主题,直接 Fork 到自己的 Github ,然后在删掉原博客中的内容,在上传自己的文章即可,以我自己的博客为例。

我的博客最初使用的是Yummy-Jekyll,但这个主题已经尽两年多都没有更新了。因此后期我在这个主题的基础上做了一些改动,其中有依赖组件的更新,结合个人情况对个别页面进行了改版,就成为了现在的样子:

使用这个主题的原因是,我比较喜欢简洁大气的风格,并且此博客主题对代码展示支持良好。

快速构建一个博客

以我的博客为例,介绍如何最快搭建一个博客。这也是我博客经历的第一个阶段。

1、首先打开地址github.com/ityouknow/i…,点击 Fork 按钮将代码复制一份到自己的仓库。

过上一分钟,你的 github 仓库发现一个 ityouknow.github.io 项目。

2、删除 CNAME 文件

删除项目中的 CNAME 文件,CNAME 是定制域名的时候使用的内容,如果不使用定制域名会存在冲突。

3、设置 GitHub Pages

点击 Settings 按钮打开设置页面,页面往下拉到 GitHub Pages 相关设置,在 Source 下面的复选框中选择 master branch ,然后点击旁边的 Save 按钮保存设置。

4、重命名项目

点击 Settings 按钮打开设置页面,重命名项目名称为:github_username.github.io。

github_username 是你的 github 登录用户名

5、重命名之后,再次回到 Settings > GitHub Pages 页面

会发现存在这样一个地址: https://github_username.github.io

这个时候,你访问此地址已经可以看到博客的首页,但是点击文章的时链接跳转地址不对,这是因为少配置了一个文件。

6、配置 _config.yml

打开项目目录下的 _config.yml 文件,修改以下配置:

repository: github_username/github_username.github.io
github_url: https://github.com/github_username
url: https://github_username.github.io
复制代码

这时候在访问地址: https://github_username.github.io,就会发现博客就已经构建完成了。剩下的事情就是去项目的 _posts 目录下删除掉我的文章,然后按照 Jekyll 的语法就写自己的文章就好了。

github_username 为你的 github id。

自定义域名

虽然通过地址https://github_username.github.io可以正常访问博客,但是技术小伙伴们肯定有人想使用自己的域名访问博客,这样的需求 GitHub Pages 也是支持的。

首先需要设置域名解析,将域名的地址指向自己的 github 博客地址。这里以万网的域名配置为例,选择需要设置的域名点击解析,在域名解析页面添加以下两条记录

空框内,需要填写自己github_username值。

然后重新打开项目的 Settings > GitHub Pages 页面,Custom domain 下的输入框输入刚才设置的域名:xxx.com,点击保存即可。

重新配置 _config.yml

打开项目目录下的 _config.yml 文件,修改以下配置:

url: http://www.xxx.com
复制代码

等待一分钟之后,浏览器访问地址:www.xxx.com 即可访问博客。

自定义 DIY 博客

一般同学到上面这一步也就完成了,基本满足了 80% 技术同学的需求。但还是有一些同学们有更高的追求,比如说使用 Github Pages 虽然简单方便,但是不能被百度检索白白流失了大量的流量,还有一个原因有些时候,博客网络访问稳定性不是很高。

当时我在国外有几个虚拟机,本来用作它用,后来在上面安装了一个 Nginx 作为静态页面的服务器。首先我在本机(win10)安装了 Jekyll 环境,将 Github 上的博客代码下载下来之后,在本机编译成静态的 Html ,然后手动上传到服务的 Nginx 目录下;然后将域名指向虚拟机。

非常不建议大家实践以上这段内容,win10 上面安装 Jekyll 环境是一段惨痛的经历。

就这样很麻烦的步骤我用了几个月后,实在是受不了了,一方面因为服务器在国外,有时候仍然不稳定(可能因为服务器安装了代理),另一方面我需要使用一些功能,使用这些功能的前提是网站需要备案,那段时间腾讯云在做活动,就把博客又从国外搬了回来,顺便重新优化了一下流程。

仍然把博客托管在 Github 上面,每次提交完代码后,在腾讯云上面执行一个脚本,这个脚本会自动从 Github 拉取最新更新的文件,并自动生产静态的 Html 文件推送到 Nginx 目录,域名重新指向这台服务器。可以在 Github 上面设置一些钩子,当提交代码的时候自动触发脚本,也可以定时触发脚本来发布文章。

脚本内容如下:

cd /usr/local/ityouknow.github.io
git pull http://github.com/ityouknow/ityouknow.github.io.git
jekyll build --destination=/usr/share/nginx/html
复制代码

执行此脚本的前提是安装好 git\jekyll 环境,这个网上有很多案例,这里就不再多描述了。
关于 Jekyll 环境搭建和使用可以参考这里:jekyllcn.com/docs/home/

最后,大家可以在这篇文章下留下你的个人博客地址,方便同行们观赏、交流、学习。

技术人如何搭建自己的技术博客相关推荐

  1. Vue + TypeScript + Element 搭建简洁时尚的博客网站及踩坑记

    前言 本文讲解如何在 Vue 项目中使用 TypeScript 来搭建并开发项目,并在此过程中踩过的坑 . TypeScript 具有类型系统,且是 JavaScript 的超集,TypeScript ...

  2. 教你一步步如何搭建自己的个人博客

    个人博客是闷骚客的必备,但是自行搭建个人博客的难度和成本都不小,所以大部分人还是会依托于第三方提供的程序,例如CSDN.简书.但是这种怎么能提现闷骚客的强大呢,特别是以后求个婚表个白要自己搞个网页的用 ...

  3. 怎么快速搭建属于自己的博客

    前言  博客平台那么多,还用创建自己的博客吗? 比如:新浪博客.网易博客.CSDN.CNBLOG等,太多的博客了. 可是有一天你还是想创建属于自己的博客,拥有自己的域名和空间. 那么怎么快速的创建属于 ...

  4. 10分钟搭建一个免费个人博客网站

    一个程序员怎么能不拥有自己的博客,本文让10分钟快速搭建部署好自己的博客 准备工作 有Gitee账号 有安装git 会 markdown 编写文档 Node.js 版本 >= 8.6 博客采用V ...

  5. 个人博客,Springboot + Vue搭建属于自己的博客

    个人博客 看到别人搭建的自己的博客,想想自己的服务器买了很久也没怎么用过,于是就想搭建一个自己的博客,上传一些自己的学习笔记心得,一些笔记方便自己查看,项目是一个前后端分离的项目,后端springbo ...

  6. 怎么搭建一个自己的博客?

    怎么搭建一个自己的博客? 总共几个步骤 买一个服务器 买一个域名 服务器环境配置 域名跟服务IP连接 然后就可以直接访问了 1.买服务器 VPS 虚拟专用服务器,就是利用虚拟化技术(如KVM.Xen. ...

  7. 【Zblog搭建博客网站】windows环境搭建属于自己的博客并发布上线 - cpolar内网穿透

    文章目录 1. 前言 2. Z-blog网站搭建 2.1 XAMPP环境设置 2.2 Z-blog安装 2.3 Z-blog网页测试 2.4 Cpolar安装和注册 3. 本地网页发布 3.1. Cp ...

  8. Pelican + Github 搭建自己的静态博客

    //想了解更多请访问我的新网站:Techwhims Techwhims.com 之前在Github上使用基本的jekyll模板搭建过一个博客,但是那时候前端技术的水平有限,搭出来的博客很不好看,一些基 ...

  9. hexo+githup搭建属于自己的博客

    hexo+githup搭建属于自己的博客 第一次搭建博客,遇到不少坑.CSDN.bing.谷歌.百度上都有大神的博客教授如何一步一步搭建属于自己的博客.不过我毕竟属于小白,文字有时给我的感受不是那么的 ...

最新文章

  1. xp系统安装oracle乱码,linux中安装Oracle汉字乱码完整解决方案
  2. 十、springboot注解式AOP(@Aspect)统一日志管理
  3. 面试算法:Maxbuild
  4. 6.Java中的变量(定义)和数据类型(划分)
  5. 基于.NET Core的优秀开源项目合集
  6. 命令行下mysql新建用户及分配权限
  7. python绘制混淆矩阵_如何实现python绘制混淆矩阵?
  8. flutter bloc_如何使用BLoC模式处理Flutter中的状态
  9. 爱奇艺漫威等系列电影因版权到期下架 会员无补偿
  10. WINDOWS登录系统之前(欢迎界面)运行指定程序脚本服务
  11. 瑞芯微读取寄存器_瑞芯微Android软件中添加ALC5640 音频CODEC 的寄存器修改
  12. c51汇编语言循环指令,汇编语言循环指令loop
  13. RS485接口与RJ45接口的区别与通讯限制
  14. 用极大似然法估计因子载荷矩阵_关于因子分析|stata
  15. html怎么给一段文字加边框,css怎么给文字加边框
  16. KataGo线程/权重/显卡
  17. 考研计算机专业流程,计算机专业考研复试基本流程-文都教育.doc
  18. 【编程开发】之 Java 实现邮件发送
  19. HTML之基础篇--陈小沫
  20. 数据安全之MySQL数据加解密的实现方案

热门文章

  1. oracle索引优劣,ORACLE的五种表的优缺点概述
  2. php调用selenium,从php调用python selenium
  3. qt vs 不出来dos窗口_VS嵌入QT后,建立QT工程后printf和cout无效,无法产生控制台应用程序窗口,需设置工程属性...
  4. java练习:模拟试下你斗地主的洗牌、发牌、看牌功能
  5. linux升级ssh到6.6版本,centos6.5升级openssh到7.4版本
  6. python封装api linux_python Socket编程-python API 与 Linux Socket API之间的关系
  7. WAVE SUMMIT平行论坛 :产教融合,人才共育
  8. 写给第十七届,来自十六届的感想与建议
  9. 2021年春季学期-信号与系统-第八次作业参考答案-第十一小题
  10. 测量ATMEGA8单片机IO口的输入输出内阻