前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >手把手教你搭建一个技术人的博客

手把手教你搭建一个技术人的博客

作者头像
山禾说
发布2020-07-24 14:37:43
4370
发布2020-07-24 14:37:43
举报
文章被收录于专栏:Vi的技术博客Vi的技术博客

搭建前的准备

在我们正式开始搭建一个完全属于我们自己的博客之前,我们首先要做好一些事前的准备(当然,如果你没有做好准备也没有关系,下面会一步一步的教你搞定这些)

  1. 服务器一台 or github 账号一个(二选一)
  2. 域名一个(可选)
  3. node.js(建议10.0以上版本)
  4. git

域名和服务器的购买我这里就不在文章中进行讲解了,各大云厂商都还不错,大家可以自行搜索进行购买~

基础架构

这里我选用的博客方案是较为成熟的 Hexo 静态博客进行操作的

下面来讲解一下上面需要准备的东西都有什么用,分别是三种部署方式

  1. 如果你有一台服务器,可以选择把博客部署到自己的服务器,这样的好处是国内访问速度快,在进行百度搜索SEO的方便(因为百度貌似把github的站点屏蔽掉了),但是比较麻烦,需要有一定命令行的基础(当然如果你没有也没有关系,毕竟像我这样贴心的人肯定是手把手的教)
  2. 如果没有服务器,我们可以使用 Github Pages 服务,这样的做的好处是方便,最快五到十分钟就可以搭建一个出来大致的样子出来,但是由于GitHub的服务器在国外,国内的访问速度上就会收到一定影响。
  3. 和第二种相差无几,我们可以选择把博客部署到 GitLab Pages 服务上,和第二种方法有一些小的区别,但是也很方便~

当然,像我这么贴心的博主,肯定是三种方法都教给你,由你自己去做出选择,看到这里我觉得就可以交出你的四连(关注+点赞+在看+转发)了~

准备工作

申请GitHub账号
  1. 打开注册网址
  1. 填写相关信息后即可完成注册
安装NodeJS
  1. 打开下载地址
  1. 选择合适的版本,傻瓜式安装即可~
  2. 打开命令行,输入node -v,看到如下图所示的版本信息即为成功~
安装Git
  1. 打开下载地址
  1. 选择合适的版本,傻瓜式安装即可~
  2. 打开命令行,输入git --version,看到如下图所示的版本信息即为成功~

截止这里,我们要做的前置工作就可以告一段落了,下面我们开始

本地hexo安装

无论哪一种方法,都离不开这第一步,在我们本地的电脑中安装 hexo

代码语言:javascript
复制
npm install hexo-cli -g
$ hexo init blog && cd blog
npm i
hexo s

按照上面的顺序进行操作,最后在浏览器中输入 localhost:4000即可看到效果~

方法一:部署在自己的服务器上(建议有一定编程基础的人员服用)

在服务器上安装 git
  1. 如果在我们的服务器上输入git --version毫无反应,说明该服务器镜像上没有预装git,就需要我们去手动安装~
  2. 安装git
代码语言:javascript
复制
yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel perl-devel
yum install -y git
  1. 创建用户
代码语言:javascript
复制
useradd git
passwd git
  1. 切换到该用户去创建仓库
代码语言:javascript
复制
su git
cd /home/git/
mkdir blog
mkdir repo
cd repo
git init --bare blog.git
  1. 创建钩子
代码语言:javascript
复制
cd blog.git/hooks
vi post-receive
// 输入内容
#!/bin/sh
git --work-tree=/home/git/blog --git-dir=/home/git/repo/blog.git checkout -f
  1. 赋权
代码语言:javascript
复制
chmod +x post-receive
exit // 退出到 root 登录
chown -R git:git /home/git/repos/blog.git // 添加权限
  1. 测试
代码语言:javascript
复制
git clone git@server_ip:/home/git/blog/blog.git

如果可以拉取成功,就说明我们的服务器配置已经搞定了~

在服务器上安装 nginx
  1. 安装nginx
代码语言:javascript
复制
cd /usr/local/src
wget http://nginx.org/download/nginx-1.16.1.tar.gz
tar xzvf nginx-1.16.1.tar.gz
cd nginx-1.16.1
./configure
make && make install
alias nginx='/usr/local/nginx/sbin/nginx'
  1. 配置nginx
代码语言:javascript
复制
cd /usr/local/nginx/conf
mkdir vhost & cd vhost
vi myblog.conf
代码语言:javascript
复制
server{
     listen    80;
     root /home/git/shanhe/blog/;
     index index.html index.php;
     location /{
     }
}
代码语言:javascript
复制
vim ../nginx.conf
代码语言:javascript
复制
// 在http下引入即可
include /etc/nginx/vhost/*.conf;

至此nginx的配置便告一段落~

部署到服务器上
  1. 安装推送工具
代码语言:javascript
复制
npm install --save hexo-deployer-git
  1. 修改_config.yml文件
代码语言:javascript
复制
deploy:
  type: git
  repo: git@server_ip:/home/git/repo/blog.git
  branch: master
  1. 在本地的博客文件夹下输入deploy命令,并输入账号密码即可~
代码语言:javascript
复制
hexo clean && hexo generate --deploy
  1. 输入你的服务器IP,即可访问查看效果啦~

方法二:部署到GitHub Pages上(建议新手服用)

和第一种方法相比,这种方法无疑是简单了许多,如果熟练的话,可以在五分钟之内即可完成,强烈建议新手使用!

  1. 创建名称为xxx.github.io的仓库(xxx是你的github账号)
  1. 找到仓库地址
  1. 修改_config.yml文件
代码语言:javascript
复制
deploy:
  type: git
  repo: git仓库地址
  branch: master
  1. 在本地的博客文件夹下输入deploy命令,并输入账号密码即可~
代码语言:javascript
复制
hexo clean && hexo generate --deploy

绑定个人域名

  1. 在我们的博客根目录下添加CNAME文件,里面写上我们的域名
代码语言:javascript
复制
shanhe.show
  1. 然后在域名解析分别解析指到我们服务器的ip或者xxx.github.io。
  2. 将本地的项目重新deploy一遍即可输入域名查看效果
  3. 域名现在都需要备案,否则无法访问(备案我会单独写一篇教程,折腾了我好久。到我写这篇文章也没备案好)

下篇教你配置主题,打造博客,预览图片如下:

如果你有学到,请给我点赞?+关注,这是对一个坚持原创作者的最大支持!我是山禾,千篇一律的皮囊,万里挑一的灵魂,一个不太一样的写手。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-07-06,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 山禾说 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 搭建前的准备
  • 基础架构
  • 准备工作
    • 申请GitHub账号
      • 安装NodeJS
        • 安装Git
          • 本地hexo安装
          • 方法一:部署在自己的服务器上(建议有一定编程基础的人员服用)
            • 在服务器上安装 git
              • 在服务器上安装 nginx
                • 部署到服务器上
                • 方法二:部署到GitHub Pages上(建议新手服用)
                • 绑定个人域名
                相关产品与服务
                访问管理
                访问管理(Cloud Access Management,CAM)可以帮助您安全、便捷地管理对腾讯云服务和资源的访问。您可以使用CAM创建子用户、用户组和角色,并通过策略控制其访问范围。CAM支持用户和角色SSO能力,您可以根据具体管理场景针对性设置企业内用户和腾讯云的互通能力。
                领券
                问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档