原文公布于https://www.fangzhipeng.com/life/2018/10/14/how-to-build-blog/

我从2016年开始写博客,陆陆续续写了大略两百篇博客。写博客有很多益处,其一是它可能迫使你总结你学习的常识,你需岂但的消化本人的知识点,使你对常识有了更粗浅的意识;其二是你的博客如同你的个人简历,记录了你的学习历程,通过写博客,能够让他人意识你,能够结交更多的行业敌人;其三,博客起到了流传常识的作用,特地是技术类的博客可能帮忙他人解决技术问题,帮忙人是一件高兴的事,何乐而不为。所以写博客对于程序员来说至关重要,在我之前的文章,我曾经讲述过了,写博客给我带来了什么,再次不在赘述。

我一开始写博客是从简书开始的,过后被简书优雅的markdown写作形式所吸引。刚开始写文章网的浏览量,一篇可能达到几百的浏览量是十分开心的事件,如果可能被简书举荐到首页可能开心好几天。在简书我意识了木东居士、仗剑走咫尺,并在那时建设了简书圈,并放弃了十分好的友情关系,十分的宝贵。

大略17年初我将本人的写博客次要阵地转移到了CSDN,起因是CSDN在百度搜索引擎中占据了最高的权重。前面证实我的判断是正确的,我的CSDN博文浏览量一路飙升,让更多的人能够的浏览我的博客。

就在上个月我浏览了纯净的微笑的博文 技术人如何搭建本人的技术博客这篇文章,我决定折腾一下搭建一下本人的集体博客。

其实在17年,我就开始搭建了本人的集体博客,采纳Jekyll动态博客,托管在github下面的,并且买了本人的域名fangzhipeng.com,cname到github上。因为github网络不稳固,体验切实是太差,始终没有怎么打理,处于一种无人治理的状态。

就在月初,我将集体的博客迁徙到了本人的服务器,并在群里放进去,有人就让我写篇博文,让他参考下如何搭建属于本人的集体博客。于是我抽空写出了这篇文章。

这篇文章具体的介绍了如何搭建我的集体博客。

应用Github托管博客

在github上托管博客上非常简单的一件事,只须要fork一个你喜爱的博客的主题,并将fork的工程名批改为{github-username}.github.io,并将原博主的文章删除,并放上本人的博文,就能够了。

比方我的博客应用的是https://github.com/Huxpro/hux...,首先我将这个我的项目fork一下,并将fork后的我的项目改名字为forezp.github.io,读者须要将forezp替换成本人的github用户名。

而后关上网页forezp.github.com就能够拜访该主题的博客了。将批改后我的项目git clone下来,依照主题阐明进行配置的批改,将原博主的文章删除,替换成本人的博文,git push批改后的工程到github下面,github pages就会主动构建,依据你的批改内容生成页面,拜访{github-username}.github.io就能够看到批改后的内容。

如果你须要本人的域名,能够在阿里云上申请本人的域名,[比方的我的域名为fangzhipeng.com]()。在阿里云的控制台的域名解析配置以下的内容:

阿里云域名注册地址:https://wanwang.aliyun.com/?aly_as=urN-DkV3U&source=5176.11533457

并在我的项目中的根目录上加CNAME文件,写上本人申请的域名,比方的我的:

www.fangzhipeng.com

大略过10-20分钟之后,就能够通过域名拜访你的集体博客了,通过{github-username}.github.io拜访集体博客也会显示你申请的域名。

须要留神的是,域名须要备案哦。

应用本人的服务器部署博客

应用Gthub搭建集体博客简略、快捷、不便,然而Github在国外啊,网络极其不稳固,拜访速度慢,让人抓狂,这时能够将本人的博客部署在阿里云的ECS上。ECS须要购买哦,须要购买的同学点击这里,支付代金券。

自己应用Jekyll进行搭建的博客,所以须要在服务中装置Jekyll环境,我的服务器零碎版本为entOS 7.2,装置的jekyll版本为3.8.4。

装置jekyll次要参考了https://jekyllcn.com/docs/ins...,因为装置过程比拟繁琐和报的错比拟多,当初具体解说下,在我装置jekyll的过程和所遇到的坑。

装置Node

装置Node环境,执行以下命令:

wget https://nodejs.org/dist/v8.12.0/node-v8.12.0-linux-x64.tar.xzxz -d node-v8.12.0-linux-x64.tar.xztar -xf node-v8.12.0-linux-x64.tar ln -s ~/node-v8.12.0-linux-x64/bin/node /usr/bin/nodeln -s ~/node-v8.12.0-linux-x64/bin/npm /usr/bin/npmnode -v npm 

装置ruby

Jekyll依赖于Ruby环境,须要装置Ruby,执行以下命令即可:

 wget https://cache.ruby-lang.org/pub/ruby/2.4/ruby-2.4.4.tar.gz mkdir  -p /usr/local/ruby tar -zxvf ruby-2.4.4.tar.gz  cd ruby-2.4.4 ./configure --prefix=/usr/local/ruby make && make install cd ~ vim .bash_profile  source .bash_profile 

装置gcc

装置gcc执行以下命令:

yum -y update gccyum -y install gcc+ gcc-c++ 

装置jekyll

最初装置Jekyll,执行以下命令

gem install jekylljekyll --versiongem update --system 

能够通过jekyll --version查看版本来验证是否装置胜利,如果装置胜利,则会显示正确的版本号。

装置过程中可能存在的问题

应用jekyll创立一个博客模板,并启Server服务,执行以下的命令:

jekyll new myblogcd myblog/jekyll serve 

当执行jekyll serve命令,我服务器环境报来以下的谬误:

`block in verify_gemfile_dependencies_are_found!': Could not find gem 'minima (~> 2.0)' in any of the gem sources listed in your Gemfile. (Bundler::GemNotFound)    from /usr/local/ruby/lib/ruby/site_ruby/2.4.0/bundler/resolver.rb:257:in `each' 

查了相干的材料,须要装置bundler和minima插件,装置命令如下:

gem install bundlergem install minima 

部署我的博客

部署博客须要在服务器中编译博客,而后编译后的博客放在Nginx服务的动态门路上

编译博客

须要git工具,下载在github下面的代码,执行以下命令:

git clone https://github.com/forezp/forezp.github.iocd forezp.github.iojekyll serve 

jekyll serve命令会编译我从github上下载的源码,在这一步,第一次执行会报以下的谬误:

Deprecation: The 'gems' configuration option has been renamed to 'plugins'. Please update your config file accordingly.  Dependency Error: Yikes! It looks like you don't have jekyll-paginate or one of its dependencies installed. 

是因为博客须要用到sitemap和paginate插件,装置下即可。

gem install jekyll-sitemapgem install jekyll-paginate 

从新执行jekyll serve,运行胜利,此时能够通过curl命令查看服务器里部署的博客。

部署到Nginx服务器上:

通过Jekyll编译后的动态文件须要挂载到Nginx服务器,须要装置Nginx服务器。 装置过程参考了http://nginx.org/en/linux_packages.html#mainline

依照文档,新建文件/etc/yum.repos.d/nginx.repo,在文件中编辑以下内容并保留:

[nginx]name=nginx repobaseurl=http://nginx.org/packages/centos/7/$basearch/gpgcheck=0enabled=1

而后执行装置nginx命令,如下:

yum install nginx 

Nginx配置胜利后,须要设置Nginx的配置,配置文件门路为/etc/nginx/conf.d/default.conf,配置的内容如下:

 server {    listen       80;    server_name  localhost;     location / {        root   /usr/share/nginx/html;        index  index.html index.htm;    }     error_page  404              /404.html;     error_page   500 502 503 504  /50x.html;    location = /50x.html {        root   /usr/share/nginx/html;    }      } 

装置Nginx服务器胜利后,将Jekyll编译的博客动态html文件输入到Nginx服务器上,执行以下的命令:

jekyll build --destination=/root/blog/html 

启动Nginx服务器,就能够失常的博客网页了,如果须要在浏览器上拜访,须要在阿里云ECS控制台的平安组件裸露80端口。如果想通过域名拜访,须要将域名解析设置指向你的服务器。

非www域名的重定向到www

比方我想拜访http://fangzhipeng.com重定向...://www.fangzhipeng.com上,须要在Nginx的配置文件/etc/nginx/conf.d/default.conf,批改配置以下内容:

listen       80;    server_name  fangzhipeng.com www.fangzhipeng.com;      if ( $host != 'www.fangzhipeng.com' ) {          rewrite "^/(.*)$" http://www.fangzhipeng.com/$1 permanent;         } 

自动化部署

通过设置github的webhook能够实现自动化构建和部署。过程是,提交博文或者配置到github仓库,仓库会触发你设置的webhook,会向你设置的webhook地址发送一个post申请,比方我设置的申请是在服务器的跑的一个Nodejs程序,监听gitub webhook的申请,承受到申请后,会执行shell命令。

首先设置github仓库的webhook,在github仓库的我的项目界面,比我的我的我的项目界面https://github.com/forezp/for...,点击Setting->Webhooks->Add Webhook,在增加Webhooks的配置信息,我的配置信息如下:

  • Payload URL: http://www.fangzhipeng.com/incoming
  • Content type: application/json
  • Secret: a123456

这样Webhook就设置胜利了,当初在博客所在的服务端去监听Github Webhook发送的申请,我采纳的开源组件去监听github-webhook-handler,我的项目地址为:https://github.com/rvagg/github-webhook-handler,首先装置:

npm install -g github-webhook-handle

装置胜利后,在/root/node-v8.12.0-linux-x64/lib/node_modules/github-webhook-handler下新建deploy.js文件:

var http = require('http')var createHandler = require('github-webhook-handler')var handler = createHandler({ path: '/incoming', secret: 'a123456' })  function run_cmd(cmd, args, callback) {  var spawn = require('child_process').spawn;  var child = spawn(cmd, args);  var resp = "";   child.stdout.on('data', function(buffer) { resp += buffer.toString(); });  child.stdout.on('end', function() { callback (resp) });} http.createServer(function (req, res) {  handler(req, res, function (err) {    res.statusCode = 404    res.end('no such location')  })}).listen(3001) handler.on('error', function (err) {  console.error('Error:', err.message)}) handler.on('push', function (event) {  console.log('Received a push event for %s to %s',    event.payload.repository.name,    event.payload.ref);  run_cmd('sh', ['./start_blog.sh'], function(text){ console.log(text) });}) 

上述代码中,指定了nodejs服务的蹂躏端口为3001,监听了path/incoming,Secret为a123456,这和之前Github Webhook设置的要保持一致。代码run_cmd(‘sh’, [’./start_blog.sh’],指定了承受到申请后执行./start_blog.sh,start_blog.sh文件的代码如下,首先进入到博客的代码文件,拉代码,编译。

echo `date`cd /root/forezp.github.ioecho start pull from github git pullecho start build..jekyll build --destination=/usr/share/nginx/html 

而后须要应用forever来启动deploy.js的服务,执行命令如下:

sudo npm install forever -g   #装置$ forever start deploy.js          #启动$ forever stop deploy.js           #敞开$ forever start -l forever.log -o out.log -e err.log deploy.js   #输入日志和谬误/root/node-v8.12.0-linux-x64/lib/node_modules/forever/bin/forever start -l forever.log -o out.log -e err.log deploy.js 如果报错:/root/node-v8.12.0-linux-x64/lib/node_modules/forever/bin/forever start -a -l forever.log -o out.log -e err.log deploy.js 

最初一步,须要在nginx服务器的配置文件,须要将监听的/incoming申请转发到nodejs服务上,配置代码如下:

location = /incoming {     proxy_pass http://127.0.0.1:3001/incoming;}

这样,当你提交了文章或者批改的配置到gitub上,github通过webhook向你所在的服务器发送申请,服务器接管到申请后执行 sh命令,sh命令包含了从新pull代码和编译代码的过程,这样自动化部署就实现了,你只需提交代码,服务器就触发pull代码和从新编译的动作。

补充

博客能够设置百度统计、谷歌剖析、不蒜子统计、Gittalk留言板等性能,这些性能须要本人申请账号,实现起来比较简单,具体本人百度。

另外,如果博客须要上https协定,须要在阿里云申请收费的SSL证书,申请完之后,能够在阿里云上查看Nginx装置SSL证书的教程,并做配置,依照它的提醒来,比较简单。最初波及到了涉一个重定向的问题,比方我的网站,我须要将 http://fangzhipeng.com、http://www.fangzhipeng.com 、https://fangzhipeng.com 全副重定向到https://www.fangzhipeng.com,这时须要批改nginx的配置文件default.conf,当初我贴出我的残缺的配置如下:

 server {        listen       80;        server_name  fangzhipeng.com www.fangzhipeng.com;        return 301 https://www.fangzhipeng.com$request_uri;    }server {        listen 443;        server_name fangzhipeng.com;        return 301 https://www.fangzhipeng.com$request_uri;    } server {    listen 443 default_server ssl;    server_name  www.fangzhipeng.com;    #if ( $host != 'www.fangzhipeng.com' ) {    #      rewrite "^/(.*)$" http://www.fangzhipeng.com/$1 permanent;    #  }     ssl on;    root html;    index index.html index.htm;    ssl_certificate   cert/215042476190582.pem;    ssl_certificate_key  cert/215042476190582.key;    ssl_session_timeout 5m;    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;    ssl_prefer_server_ciphers on;     location / {        root   /usr/share/nginx/html;        index  index.html index.htm;    }     error_page  404              /404.html;     # redirect server error pages to the static page /50x.html    #    error_page   500 502 503 504  /50x.html;    location = /50x.html {        root   /usr/share/nginx/html;    } } 

到此,我的博客搭建过程全副解说结束,如果有任何问题欢送加我微信miles02(备注博客疑难)和我探讨,如果问的人多,我思考建一个交换群,大家一起探讨答疑。大家也能够在留言版上留下本人的博客,让大家相互拜访。

写博客贵在保持,贵在有一颗分享的心。我是看了纯净的微笑的博文,才有能源折腾了一下本人的博客,心愿你看了我的这篇博文,会有本人搭建博客的激动,而后本人入手残缺的搭建,谢谢大家。