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

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

作者头像
山禾说
发布于 2020-07-24 06:37:43
发布于 2020-07-24 06:37:43
49500
代码可运行
举报
文章被收录于专栏:Vi的技术博客Vi的技术博客
运行总次数:0
代码可运行

搭建前的准备

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

  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
代码运行次数:0
运行
AI代码解释
复制
npm install hexo-cli -g
$ hexo init blog && cd blog
npm i
hexo s

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

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

在服务器上安装 git
  1. 如果在我们的服务器上输入git --version毫无反应,说明该服务器镜像上没有预装git,就需要我们去手动安装~
  2. 安装git
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel perl-devel
yum install -y git
  1. 创建用户
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
useradd git
passwd git
  1. 切换到该用户去创建仓库
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
su git
cd /home/git/
mkdir blog
mkdir repo
cd repo
git init --bare blog.git
  1. 创建钩子
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
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
代码运行次数:0
运行
AI代码解释
复制
chmod +x post-receive
exit // 退出到 root 登录
chown -R git:git /home/git/repos/blog.git // 添加权限
  1. 测试
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
git clone git@server_ip:/home/git/blog/blog.git

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

在服务器上安装 nginx
  1. 安装nginx
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
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
代码运行次数:0
运行
AI代码解释
复制
cd /usr/local/nginx/conf
mkdir vhost & cd vhost
vi myblog.conf
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
server{
     listen    80;
     root /home/git/shanhe/blog/;
     index index.html index.php;
     location /{
     }
}
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
vim ../nginx.conf
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
// 在http下引入即可
include /etc/nginx/vhost/*.conf;

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

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

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

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

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

绑定个人域名

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

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

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

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

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

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

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

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
从零搭建Hexo博客并部署腾讯云服务器
腾讯云服务器已经买了好一阵子了,拖延到现在才搭博客,参考各个社区里挺多教程,最后选择使用Hexo来作为自己的博客框架,好处是不用自己造轮子,而且有很多漂亮的主题可以拿来用。今天上午把搭博客过程做个小结,希望对有想法要做自己的博客的同学们有一些帮助。
用户7978588
2020/12/19
2.4K0
使用 Vultr 搭建个人的 Hexo 博客
可以在各大域名商上去申请域名,我是在 godaddy 上申请,这里需要注意的事,域名后期续费是越来越贵的,
Bug开发工程师
2020/02/12
2.2K0
使用 Vultr 搭建个人的 Hexo 博客
将个人博客迁移到云服务器上
之前通过github 和coding 来搭建的个人博客,但是搜索引擎一直不是很好,并且总感觉不稳定,访问很慢。最近刚刚买了一个云服务器,所以就打算将个人博客迁移到云服务器上。
程序员爱酸奶
2020/03/16
2K0
将个人博客迁移到云服务器上
手把手教你搭建Hexo博客
导读|很多开发者搭建自己的博客,会选择现有的博客系统方案,比如:Wordpress、Hexo和Halo等。其中Hexo博客作为全静态博客,没有数据库、对服务器资源消耗也极低,而且可定制化程度极高。本文将带领各位开发者基于Lighthouse轻量服务器快速搭建Hexo博客。 Hexo博客是一个基于Nodejs开发的一套博客系统。借助Hexo,开发者可以把自己的Hexo配置和Markdown文章,编译为HTML、JavaScript、CSS的存静态资源。exo对每片文章都有生成.html文件和真实DOM元素,而
腾讯云开发者
2022/12/26
7530
手把手教你搭建Hexo博客
【腾讯云的1001种玩法】Hello Hexo之静态博客搭建+自动部署
饶文津
2017/04/13
4.9K0
个人hexo博客的服务端部署及构建
之前的Hexo博客放在Github上,速度太慢了,在腾讯云上买了台服务器,将博客放到上面,本节主要阐述Nginx服务端部署+Nginx优化+HTTPS部署。
公众号guangcity
2020/02/24
1.1K0
手把手搭建个人博客「图文教程」
经常阅读此公众号文章的读者可能知道,这篇教程在一个月前发布过一次,因为题图的文字字体版权问题,不得不删除。今天重新发出来,给您说声抱歉。此教程博客是在自己的云服务器上搭建的,如果没有云服务器,同样可以利用GitHub免费搭建自己的博客,公众号回复:「GitHub」就可以获取视频教程。
用户1093975
2018/08/02
2.7K2
手把手搭建个人博客「图文教程」
将 Hexo 部署在云服务器
将 Hexo 部署在云服务器 前言 众所周知,使用 GitHub Page 的访问速度令人发指,当然也有很多人选择部署到 Vercel,这便是我之前的选择,免费,同时还有着更快的速度。但说到底,云服务器往往是更好的选择,只要钱到位 😑。 使用宝塔面板可以比较方便快速的进行部署,不过我更想自己实际动手操作,也一边学习 Linux,就不使用了。 准备工作 本文假设你拥有 Hexo 建站相关的知识,相关的问题不再赘述,你也可以点击这里查看 Hexo 建站相关的知识。 在阅读本文之前,你需要做好以下准备:
EmoryHuang
2022/10/31
5.2K0
用旧手机改造成 Web 服务器并实现内网穿透
然后打开 Linux Deploy,点击右下方的配置,设置系统相关信息,容器类型选 chroot,发行版选 CentOS,如果选其他发行版,架构一定要选对,不然会安装出错,或者无法使用,安装之前一定要知道手机CPU的架构;源地址建议切换为国内源,这里放上中科大的镜像源 http://mirrors.ustc.edu.cn/centos-altarch/ ,国内还有其他源可选择,例如清华源,阿里源等
雨落秋垣
2024/10/22
1260
个人网站转到云服务器上
用命令yum install -y nginx git安装git,安装完后分别输入git --version、nginx -v,出现相应#版本号即为安装成功。### 三、服务器Nginx的配置 在根目录创建博客站点的文件,并更改文件权限
项勇
2020/01/02
12.4K0
Mac/Linux/Windows如何从零开始搭建Hexo静态博客并部署到远程平台
本文同步博客图文( ´▽`):https://www.mintimate.cn/2020/03/19/hexo
Mintimate
2021/01/29
2.2K0
Mac/Linux/Windows如何从零开始搭建Hexo静态博客并部署到远程平台
Gatsby 博客部署到腾讯云教程
原文发表于:https://avenirzheng.net/blog/2020/deploying-gatsby-to-tencent-cloud/
Avenir
2020/03/20
4.3K2
Gatsby 博客部署到腾讯云教程
博客更新-迁移博客至Hexo的艰辛
Windows下访问GitDownload下载页面(已下载可跳过) 由于下载速度可能过慢,这里给网盘下载
筱锋xiao_lfeng
2022/03/16
4550
博客更新-迁移博客至Hexo的艰辛
Hexo 博客部署到腾讯云教程
本文首发于我的个人博客:『不羁阁』文章链接:传送门 本篇内容用来讲述如何将 hexo 博客部署到腾讯云的服务器上。 只要通过三步即可成功部署: 云服务器端 git 的配置 Nginx 的配置 本地端 hexo 的设置更改 前言 最近趁着腾讯云在做活动,买了3年的服务器。正好自己的博客之前是搭建在 coding 上的,现在也可以顺便部署到腾讯云上了。其实过程蛮简单的,即使,你是个对后台一窍不通的小白,也能很容易部署成功。顺便安利下腾讯云的活动。通过以下两步,即可360块钱买到40个月(三年半)的云服务
程序员充电站
2018/05/31
7.5K1
手把手教你搭建 Hex0 + GitHub 博客
因为 npm 命令是 node 中的,所有需要先安装node 然后再安装 hexo,然后利用 npm 命令即可安装 hexo(Windows 在任意位置点击鼠标右键,选择 Git bash,Mac 直接在终端中如下执行命令即可)
程序员飞飞
2020/02/27
2K0
hexo搭建个人网站博客完全教程
我觉得现在身处于互联网时代,有自己的个人网站其实就和互联网上的一张名片差不多了,在这里可以不断的记录自己的生活,总结自己的知识,人生思考什么的,以后介绍自己直接把网站扔给对方。一来是可以装下逼,二来是可以让对方更好的了解自己。
RD.Timon
2020/10/26
7.6K1
hexo搭建个人网站博客完全教程
手把手教你从零开始搭建个人博客,20 分钟上手
大家好,我是爱思思爱猫爱技术的老表,最近一直在研究个人博客搭建,目前正在进行的有 Django 个人博客搭建系列,最近了解到还有很多现成的博客搭建框架,准备后面依次给大家分享下。
老表
2021/11/03
4K0
手把手教你从零开始搭建个人博客,20 分钟上手
【玩转Lighthouse】搭建Hexo博客并将Lighthouse作为网站发布平台和图床
相信很多人选择搭建自己的博客,会选择现有的博客系统方案,比如:Wordpress、Hexo和Halo等。
Mintimate
2022/04/13
2.3K2
【玩转Lighthouse】搭建Hexo博客并将Lighthouse作为网站发布平台和图床
手把手教你搭建GitHub个人博客网站
新建一个名为你的用户名.github.io的仓库,这里,我的github用户名是Wasabi1234,那么就新建Wasabi1234.github.io的仓库,必须是你的用户名,其它名称无效,将来你的网站访问地址就是 http://Wasabi1234.github.io
JavaEdge
2022/11/30
8170
手把手教你搭建GitHub个人博客网站
都2022年了,还没有自己的博客网站?
今天来给大家分享一下我的个人博客网站搭建过程,准确的来说应该是迁移过程。之前我的博客是基于Hexo+GitHub Pages实现的,也就是说由GitHub来承载了静态代码和页面的展示,也就是通常看到的xxx.github.io的形式,当然了也可以自己更换域名。
Java阿呆
2022/04/15
5860
都2022年了,还没有自己的博客网站?
推荐阅读
相关推荐
从零搭建Hexo博客并部署腾讯云服务器
更多 >
领券
社区富文本编辑器全新改版!诚邀体验~
全新交互,全新视觉,新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能,全面提升创作效率和体验
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文