分享搭建自己博客的5个步骤(怎样搭建自己的博客)

早在今年年初就有搭建自己的博客的打算,在了解之前其实在网上有很多关于搭建博客相关的文章。自己也是跟着别人的教程搭建了一个本地的博客,但是搭建好过后也就没有下一步的打算了。好在上几周自己醒悟了,在阿里云买了一个域名,顺便又从新搭建了一个基于hexo的博客,并绑定到了自己买的域名上去了。所以此处并记录一下自己在搭建博客的步骤以及图和绑定域名(注意此处是基于hexo + coding来搭建博客的。github和coding的博客搭建其实都是差不多的,知识coding在国内的访问速度比较快而已)。

第一步:创建项目并配置SSH和项目的pages服务

在coding上创建一个项目(注意:没有coding账号的需要自己注册账号),给自己创建的项目命名,此处我命名为blogtest。

仓库创建好了过后我们再配置SSH,SSH是管理代码仓库的公钥。其他的就不做介绍了,因为自己也没有深入的了解过,如想了解的可在网上搜索廖雪峰的git教程即可。先在本地安装git。如果git安装好了就在本地生成ssh公钥,如果本地有的就不需要了,只需要将本地的公钥配置到你的个人信息(这里配置了个人的公钥,没有配置项目单独的公钥)里面就可以。

  1. 打开git bash,使用如下命令创建ssh公钥(如果本地有生成的公钥则跳过这一步):ssh-keygen敲击三个回车键,表示按照默认的配置即可。
  2. 使用如下命令查看生成的ssh公钥并复制公钥内容

3.将打印出来的公钥复制到你的仓库里面并点击添加即可。

ssh配置好了过后,我们再配置项目的pages服务。打开项目,在代码模块里面有一栏Pages服务,选择静态Pages(此处创建的为静态博客),选择分支(在创建项目的时候我们默认勾选了创建一个README.md,所以在创建仓库的时候就已经给你创建好了一个默认的master分支)来源并保存。

第二步:Hexo的环境搭建并创建一个本地的博客

此处我们根据Hexo的官方文档(https://hexo.io/zh-cn/docs/ )来搭建Hexo的环境,并创建一个本地的博客。

  1. 安装Node.js和Git(此处我们已经安装)。Node.js我们还是采用到官网去下载安装,安装好了过后打开windows命令行输入相关命令查看node.js的版本和npm相关的版本。注意npm是随同Node.js一起安装的包管理工具,能解决Node.js代码部署上的很多问题。
  2. npm设置淘宝镜像,这点很关键。如果不设置这点的话直接用npm命令可能导致等待很长一段时间安装某些东西或者直接安装失败。此处是使用cnpm代替npm命令。直接输入以下命令即可代替。npm install -g cnpm –registry=https://registry.npm.taobao.org
  3. 代理设置好了过后我们就看是使用cnpm命令安装hexocnpm install -g hexo-cli
  4. 安装完了过后,我们首先打开命令行并进入到某文件夹路径下,使用如下命令来创建属于自己的本地博客。

5.这样初始化过后,我们使用hexo g d命令生成资源文件,再使用hexo server -p 5000 命令开启服务,使用hexo server是默认是使用本地的4000端口开启服务,我们这里使用了指定端口开启服务,那我们在本地浏览器访问试试呢。本地命令如下

6.览器访问结果

第三步:将本地生成的资源文件部署到我们创建的仓库中去

此处我们需要安装一个插件,就是hexo在发布的时候自动提交到仓库的插件。在此之前,我们首先得了解hexo得命令得含义。

  1. hexo g 命令是生成静态资源文件的,命令的全称是hexo generate,简写为hexo g。
  2. hexo d 命令是部署生成的静态资源文件,命令的全称是hexo deploy,简写为hexo d。
  3. hexo clean 清除本地生成的静态资源文件。
  4. hexo server 启动服务器。默认情况下,访问网址为: http://localhost:4000/ 。可以指定端口启动 命令为 hexo server -p [port]
  5. hexo new “文章名称” 新建文章。默认新建的文章是放在blog/source/_posts/ 目录下的。

上述只是简单的介绍了四个命令,还有其他更多的命令可以去官方文档了解。下面我们还是先使用cnpm下载所需要的插件吧。

插件下载好了过后,我们就需要在博客的配置文件中去配置相应的仓库地址和相应的分支了。blog/_config.yml文件就是整个博客的配置文件,博客所需的每个主题也有自己的配置文件(路径为blog/themes/相应的主题文件夹/_config.yml),二者不要搞混了。我们使用notepad++,sublime或者其他编辑软件打开。注意里面的参数配置,在官方文档中都有介绍,此处我们不做详细了解,我们只需要观察deploy这一部分部署的配置。

配置信息

执行命令

查看仓库的提交信息。

说明提交成功了,注意此处不是提交你整个博客文件夹,而是提交你生成的静态资源文件到你的仓库中。这里我们再来看看仓库的Pagers服务,这里肯定是有什么变化才对。见

coding给我们自动生成了一个访问地址,我们点击试试,会不会和我们在本地访问的一样呢。。。。

这是什么鬼,怎么成这逼样了。。。不是说好的界面一样呢。简直不敢相信啊。其实这是你还有地方没配置好,我们需要在博客的配置文件里面配置

将博客的url地址和根目录配置好了过后再次依次执行hexo clean,hexo g,hexo d三个命令后重新开启项目的Pages服务,等待一会儿点击链接。

效果出来了,是不是一模一样的。就是这么溜的骚操作。

第四步:配置WebHook,让你在自动提交代码后,自动部署你仓库里面的博客资源

WebHook是一个自动部署的工具,它允许第三方的应用监听你仓库内容的变化,如每一次的提交,拉取信息,删除信息等等。一般常见的是结合Jenkins使用实现提交代码后自动打包。这种效果少了人工手动打包带来的不必要的时间浪费。在项目开发和测试阶段非常适用,测试和开发的任务就相对的分开,不必要每次的修改都要手动打包。此处我们搭建博客也是如此,我们每次修改了东西后必须重新在Pages服务里面重新部署一次,这样的操作就比较繁琐了。在使用WebHook的同时,我们提交了我们的文件到仓库里面,WebHook监听到我们的提交信息就会自动部署目标URL一次。这样来实现自动部署效果。这里我们需要在项目的设置页面去添加我们的WebHook。

点击添加按钮,

点击确定后,我们就会看到我们配置的WebHook信息。我们可以进行测试,或者修改本地博客后进行提交来进行测试。

第五步:绑定我们申请的域名

上述的域名是coding自动生成的,不能修改并且还有其他的限制,这里我们需要在万网去申请自己的域名,申请过后进行审核备案。这里需要几天的时间。成功过后,我们就来绑定我们的域名。这里我已经申请了自己的域名来进行测试。

上面是阿里云的域名管理平台,我们现在先把申请的域名的 CNAME 记录到 pages.coding.me 后再到coding的Pages服务中去绑定。

将CNAME记录到 pages.coding.me 。

点击确定后,我们再到我们的项目中的Pages服务中去绑定我们的域名绑定我们的域名。

点击绑定,我们的博客链接是不是变成我们自己的域名了。点击看看效果呢。。。。。。

咋又是这个逼样啊,不是万事俱备嘛!看来还需要东风才行啊。想一想是不是我们又得重新修改我们的配置才行啊,试一试呢。。。。

  1. 重新配置完了,我们执行hexo g,hexo d两个命令试试,这里我们设置了WebHook,不需要自己重新部署了,等个一分钟左右刷新试试。
  2. 看到图中显示的真的不错,踏遍千山万水总算是搞好了。也不浪费我的苦心啊。

总结

此处我们算是从头到尾讲了一遍了,想想也是不错,坑也踩了,效果也出来了,还算对得起自己的良苦用心(注意:相关的文档还是得去去官网了解)。自己在年初的时候搞这个也花了一周多的时间,最初使用的Jekyll来搭建,现在是用的hexo来搭建,其实都是差不多的,只要搞懂原理都很简单的。hexo和Jekyll都有多种多样的主题,看自己的风格(其实我就是用的自带的,没用其他的。感觉还是自带的好看一点→_→ ╭(╯ε╰)╮)搞个自己的博客对于平时做做笔记也是很不错的。此处就是采用的hexo默认使用的主题,并且提供的主题都有相应的配置教程,只需按照教程将博客和相关的主题配置好就OK

声明:本文内容整理自网络,观点仅代表原作者本人,投稿号仅提供信息发布服务。如有侵权,请联系管理员。

投稿号的头像投稿号注册会员
上一篇 2022年10月18日
下一篇 2022年10月18日

热点推荐

  • 好看的被禁动漫排行榜(好看的被禁动漫排行榜)

    求所有被禁了的动漫 《约会大作战》第二季;约战第二季被停播了一段时间。缘故是男主角的宫里过多,有异常性的脚踏两条船,非常容易引起年轻人的价值观念。《棒球英豪》因为有学生早恋的状况,该动漫在2005年上下被停播了。 《死亡笔记》被禁…

    2023年12月16日
    390
  • 南昌一物流园突发大火 目前现场无人员被困

    9月19日20时03分消息△现场画面9月19日19时30分,江西省南昌市南昌县金沙大道上和物流园突发火灾。目前,公安、消防正在赶往现场。9月19日21时01分消息南昌县物流园火灾:现场无人员被困救援正在进行中△现场视频记者从南昌…

    2022年9月22日
    860
  • 微信图片怎么恢复原图,微信图片过期恢复原图的4种方法

    众所周知,微信聊天记录里面的图片信息,如果不及时查看的话就会被清理,之后就会显示「图片已过期」,无法查看原图。一般来说,微信图片超过3天未及时查看,就可能会被系统判定为过期,之后只能看到一个模模糊糊的小图,而无法继续查看下载。 不…

    2022年10月3日 热点
    1420
  • 世界杯-梅西进球 阿尔瓦雷斯破门 阿根廷2-1晋级

    梅西进球   北京时间12月4日03:00(卡塔尔当地时间3日21:00),2022世界杯1/8决赛展开争夺,阿根廷2比1取胜澳大利亚,梅西和阿尔瓦雷斯进球,古德温扳回一城。阿根廷将战荷兰。   阿根廷仅用戈麦斯轮换出场。澳大利亚…

    2022年12月6日
    730
  • 周海媚因病去世

    昨晚,周海媚工作室发文:“海媚姐因病医治无效,于2023年12月11日离开了我们。愿天堂没有疾病,愿来生我们再相识!” 网友评论 据公开资料显示,周海媚,1966年12月6日生于中国香港。周海媚于1985年参加无线第一期艺员训练班…

    2023年12月15日
    280
  • 小心中毒、提防心肌炎!阳了之后这十件事医生不建议做!

    近日,新冠患者因过量饮水导致水中毒、刚刚康复的患者因剧烈运动引发心肌炎等话题引发关注。阳了以后到底有什么注意事项?北京时间梳理全国各地9家知名医院10名权威医生的建议,这十件事千万别做,否则可能后悔莫及!感染后多喝水但不能过量、发…

    2023年2月2日
    650
  • 远交近攻是谁提出的(秦国远交近攻是谁提出的)

    秦国强大之后先后任命了好几任相国,这些相国都各有所长商鞅为秦国强大奠定了基础,张仪依靠外交打破各国合纵抗秦,范睢则为秦国攻伐天下制定了整体方略范睢见到秦昭襄王之后,提出“远交近攻”的策略史载“王不如远。胡阳打仗的本事不行,准备也不…

    2022年10月6日
    770
  • 读后感或观后感的步骤与方法(读后感的写作方法和技巧)

    读后感是很多同学们的“噩梦”,不管是暑假读书,还是上作文课都逃不掉,甚至连学校活动看个电影都要写观后感…… 明明是喜欢读的书或是喜欢看的电影,却因为读后感或观后感产生抵触心理。那小学生怎么写读后感呢? 01 读后感是什么? 简单说…

    2022年10月2日 热点
    850
  • 五常大米的标准号是什么

    五常大米国标号强地终巴育是GB/T19266。 五常大米者衡执行的是地理黑陈段放激甲头第强石垂标志产品标准——《GB/T19266-2008地理标志产品五常大米》,该标准规定了地理标志产品五常大米的术语和定义、地理标志延晶产品保护…

    2023年8月11日
    440
  • 日本料理知名品牌(日本料理品牌排行榜)

    苏州十大日料店排行榜(苏州好吃的日料店) 苏州淮海路的日料店非常多,如果你在苏州想要去尝尝日料,一定要选择这里。这里有几家日料店还不错,这里也是经常会有日本人前去吃饭,所以这里算得上是偶遇日本人频率最高的地方。 万宇馆特点:厨师一…

    2023年7月19日
    410