专栏首页赵俊的Java专栏Hexo搭建 --- 1、搭建 Hexo 博客并部署到 Coding

Hexo搭建 --- 1、搭建 Hexo 博客并部署到 Coding

前言

我一直想搭建一个个人博客,要求就是简洁,支持Markdown,可以显示文章的TOC目录。 寻找的过程中也遇到了很多坑,教程基本上都不完整,或者是直接copy别人的,而且很多教程中是将其部署到github pages上 ,但是介于网速问题,还是选择了国内的Coding。下面先将我的经历给大家分享下。

  • JPress :国产,开源,基于JFinal开发的,主题生态系统正在快速完善中,但是markdown支持不好,所以就放弃了。
  • Ghost : 也很简洁,基于Node.js开发,有后台管理页。与markdown支持不错,但是本人英语不好,Ghost国内站也不再继续更新,虽然基本可以满足我的需求,但是迫于强迫症还是放弃了。
  • Hexo : 很简洁,可以直接生成纯html界面,优点是支持它的环境十分好找,可以直接用githubcoding七牛云存储等静态页面托管,可以省下VPS服务器的费用。

需求条件

  • Windows电脑一台 (没用过Mac,所以无法做Mac的教程)
  • 熟悉Markdown语法 (现学也可以,入门教程 )
  • 耐心 (有耐心按照教程一步一步执行下,不能嫌麻烦就半途而废)

安装Git

下载地址:传送门 这一步最好选择第二项,其他的默认就好

安装完后打开 cmd 输入 git --version 来测试是否安装成功。

安装Node.js

下载地址:传送门 下载安装即可,没有特殊配置,无限下一步。 安装完后打开 cmd 输入 node -v 来测试是否安装成功。

安装Hexo

首先在你电脑上找一个位置来安装Hexo。然后在那个文件夹中打开cmd (shift + 右键)

下载

npm config set registry http://registry.cnpmjs.org #修改安装源为中国镜像。
npm install hexo-cli -g

初始化Hexo

hexo init
npm install
npm install hexo-util --save

测试Hexo

hexo s

然后在浏览器的地址栏上面输入localhost:4000就可看到自己博客的样子。Ctrl + C 可以终止预览

配置Coding

Cdoing官网:https://coding.net/ 注册后创建一个新项目

项目名称,项目描述随意填写,项目选择私有项目。然后点击创建。

然后在电脑桌面右键,打开Git Bash Here

然后配置SSH: 配置shh key是让本地git项目与远程的coding建立联系

  • 检查是否已经有SSH Key,打开Git Bash Here,输入

cd ~/.ssh

  • 如果没有.ssh这个目录,则我们生成一个SSH,输入

ssh-keygen -t rsa -C "你的邮箱"

  • 接下来几步中系统会要你输入密码

Enter passphrase (empty for no passphrase):<输入密码>

Enter same passphrase again:<再次输入密码>

这个密码是在你提交项目给服务器的时候使用的,可以为空,如果为空的话提交项目时则不用输入密码就能提交。

  • 最好看到类似这样的界面,就成功设置ssh key了
  • 然后查看公钥 cat ~/.ssh/id_rsa.pub

然后将这些内容全部复制下来。

  • 回到Coding 添加你的公钥

然后直接把刚才复制的内容粘贴进去,点击添加即可。

  • 设置自己的身份,这里设置自己的名字和邮箱 git config --global user.name "Your Name"
  • git config --global user.email "email@example.com"
  • 在Git Bash Here 中输入 ssh -T git@git.coding.net

如果显示以下则说明coding中的ssh配置成功 Hello username You've connected to Coding.net by SSH successfully!

  • 开启Coding Pages服务 进入你刚才创建的项目。
  • 先在根目录下找到_config.yml文件,并进入编辑。我们找到deploy这一项,修改看下面: # Deployment ## Docs: http://hexo.io/docs/deployment.html deploy: #我们是使用 git 来部署的。 type: git # git 仓库的地址。 repo: https://git.coding.net/xxx/xxxx.git # 分支名称。 branch: master

仓库的地址可以在coding网站上找到,复制过来即可

测试Coding配置

  • 新建一篇文章,并且部署到Coding上面。在Hexo安装路径下打开cmd1hexo new 第一篇文章

然后在给出的路径里打开.md文件,用markdown语法写作即可

  • 在部署之前还有一步,就是要安装一个插件,不然无法部署上去。 npm install hexo-deployer-git --save
  • 发布部署文章 hexo g -d

然后在去Coding上就可以看到部署的文件了

至此,搭建完成。有关Hexo的详细配置,请参阅Hexo官方文档

如本文中有错误,欢迎在评论中进行指正。转账请注明出处,谢谢支持。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 将 Hexo 个人博客同时部署到 GitHub 和 Coding 上

    关于如何快速搭建自己的个人博客,如何完善自己的个人博客,什么是 GitHub ,如何将自己的博客代码托管到 GitHub 上面等等问题,我之前写过三篇文章已经做...

    compassblog
  • 将 Hexo 个人博客同时部署到 GitHub 和 Coding 上

    关于如何快速搭建自己的个人博客,如何完善自己的个人博客,什么是 GitHub ,如何将自己的博客代码托管到 GitHub 上面等等问题,我之前写过两篇文章已经做...

    compassblog
  • 利用Hexo+coding搭建博客,优化github博客打开速度

    上次用hexo和github上搭建博客后,用了几天发现博客搭建在github上有一定的局限:

    用户2458785
  • 利用hexo和github或coding 搭免费个人博客

    博客对我来说,就像一个云端笔记,可以记录一下自己在完成各种任务中坑,也可以让别人看到从而避免这些,可以写博客的地方有很多比如csdn、博客园、简书之类的,但是看...

    earthchen
  • Hexo部署远程仓库(Conding、Gitee、Github)

    Git可以有效、高速的处理各种项目版本管理。也就是用来管理你的hexo博客文章,上传到GitHub的工具。

    咕咕星
  • 使用 Hexo & GitPage 搭建博客

    GitPage 是个什么东西?它和 GitHub 是什么关系?Hexo 又是什么?它和 GitPage 又是什么关系?为什么我要用 Hexo + GitPage...

    SkyRiN
  • 最快的 Hexo 博客搭建方法

    使用 Cloud Studio ,就不需要再折腾 Hexo 环境,不需要再解决不同平台上的各种冲突,直接在 Cloud Studio 里面即可进行 Hexo 的...

    CODING
  • Webify实战:快速、低成本部署个人Hexo静态博客

    Hexo是一款简洁且高效的博客框架,我一般称呼为Hexo博客引擎。使用Hexo,可以快速根据自己本地的博客配置和文章内容自动创建为纯静态的博客网站。对比Word...

    Mintimate
  • Hexo双线程开启,就等你上车起飞了

    DataScience
  • Hexo博客搭建

    为什么网上这么多教程,我还要在这里写下一篇呢?主要是总结大家的经验和自己的操作过程,一来是方便自己看,二来是给大家提供一些参考。Google一下,你可以找到几乎...

    BessCroft
  • 个人博客搭建心得

    我是从18年开始写博客,最初的平台选择在博客园,界面比较清爽,但是博客园主要是针对互联网软件行业的,我发的内容相对来说偏硬件,后来转战CSDN,自带图床用的很爽...

    Mculover666
  • Hexo博客教程(三)| Github、Coding 部署Hexo站点详解

    之前我们在本地使用hexo s启动服务,然后浏览器访问http://localhost:4000即可访问到博客,但是博客搭建好之后总不能只有我们自己可以用,所以...

    Mculover666
  • 低成本个人建站系列二 —— 使用 Hexo+GitHub 搭建个人免费博客

    GitHub Pages 是由 GitHub 官方提供的一种免费的静态站点托管服务,让我们可以在 GitHub 仓库里托管和发布自己的静态网站页面。

    浩Coding
  • 这可能是迄今为止最全的hexo博客搭建教程

    这是阮一峰在博客中写到的关于 Blog 的想法,而这里的第三阶段的实现就是利用 GitHub Pages 搭建博客。

    程序员小明
  • 这可能是迄今为止最全的hexo博客搭建教程

    这是阮一峰在博客中写到的关于 Blog 的想法,而这里的第三阶段的实现就是利用 GitHub Pages 搭建博客。

    Python数据科学
  • 2019年末,来一发基于Hexo自建博客生态指南!

    “个人博客”这一名词从很早前就广为人知了,对程序猿来说,“个人博客”也可以算是程序员们的“私人乐园”,让各位码农们可以在自己的私人博客里放飞自我。而搭建“个人博...

    心莱科技雪雁
  • 2019年末,来一发基于Hexo自建博客生态指南!

    本文篇幅较长,涉及的面较广,通篇阅读大概需要半个小时左右。建议时间紧迫的大佬们可以先收藏文章,之后闲时再细细阅读,个人预览DEMO,有关文中具体涉及到的工具大...

    云爬虫技术研究笔记
  • 说说 Hexo 静态博客框架

    今天给大家最近蛮火的 Hexo 静态博客框架,熟悉明月的都知道明月最近几天一直都在折腾研究 Hexo 静态博客框架的博客站——『明月登楼 Hexo 博客』(he...

    明月云服务
  • 不花钱不费力,Hexo + GitHub 五分钟教你免费搭一个高逼格技术博客

    作为程序员拥有一个属于自己的个人技术博客,绝对是百利无一害的事,不仅方便出门装b,面试时亮出博客地址也会让面试官对你的好感度倍增。经常能在很多大佬的技术文章的文...

    程序员内点事

扫码关注云+社区

领取腾讯云代金券