首发链接

开始之前需要在电脑上安装好Gitnode.js,Mac上可以使用Homebrew命令行工具来安装Git和node.js

安装Homebrew

在命令行工具输入以下命令,如果已经安装过Homebrew可以忽略

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
Homebrew 安装 node.js
brew install node

安装后可以使用命令来检查是否安装成功

检查node

node -v

输出结果:

v12.14.1

检查npm是否安装成功,npm是node.js的包管理工具,用它来安装hexo

nmp -v

输出结果:

6.13.4
Homebrew 安装git
brew install git

检查git是否安装成功

git -v

输出结果:

git version 2.24.3 (Apple Git-128)
使用 npm 安装 hexo
sudo npm install -g hexo-cli

安装完成后,在Desktop创建一个blog文件夹,在该文件夹下初始化我们的博客

cd ~/Desktop && mkdir blog && cd blog

在该文件件目录下执行博客初始化操作

# 会下载一些node.js的依赖文件
hexo init

初始化成功后,在blog目录下执行预览操作

hexo s

当看到如下输出就可以预览我们创建的博客了

INFO  Validating config
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

预览效果如下

配置客户端git 添加SSH Key到github

如果已经配置过,该步骤可以忽略

在命令行输入配置用户名和账号的命令

git config --global user.name "username"
git config --global user.email "email@gmail.com"

其中 username是你的用户名,email@gmail.com是你github的登录邮箱

然后通过终端命令生成SSH Key

ssh-keygen -t rsa -C "email@gmail.com"

如果已经创建过会出现 Overwrite (y/n)? n提示可以输入 n,如果没有创建过会要求我们输入密码,然后一路回车下去就行,执行完成后会在~/.ssh/id_rsa.pub目录下生成 需要使用的 key。

可以使用命令行输出key并复制

cat ~/.ssh/id_rsa.pub

或者可以找到这个文件并打开它,复制里面的内容。

登录github账号 找到 setting

先点击 SSH and GPG keys然后再点击 New SSH key 进入到配置 SSH Key 的页面

然后输入复制好的key的内容

点击 Add SSH Key 即可

本地博客关联到Github主页

登录Github并且创建一个名字为 username.githug.io的仓库,比如我的仓库名字为 Johnson8888.github.io

因为我已经创建过了,所以会显示红色,如果创建过,会显示绿色的,然后点击创建。切记一定要选择 Public,否定不能访问。

然后命令行切换到本地blog目录下 cd ~/Desktop/blog

执行命令

sudo npm install hexo-deployer-git --save

然后开始修改配置文件 ~/Desktop/blog/_config.yml

修改 deploy部分为

deploy:
type: git
repo: git@github.com:Johnson8888/Johnson8888.github.io.git
branch: master

然后就可以把博客push到github了

在命令行执行

#生成我们想要的博客文件
hexo g
#将本地的博客文件push到github
hexo d

hexo d 执行成功后,就可以查看我们的Blog

开始写博客

在命令行执行

hexo new firstPage.md

会在 ~/Desktop/blog/source/_post目录下生成 firstPage.md打开这个文件就可以开心的写博客了

写完后重新执行

hexo g
hexo d

就可以同步博客到github

Todo

  • 申请域名指向博客,这样就可以直接使用域名访问了
  • hexo支持很多模板样式 可以去官网选择自己喜欢的使用
附 hexo常用命令
hexo n "博客名称"  => hexo new "博客名称"   #这两个都是创建新文章,前者是简写模式
hexo p => hexo publish
hexo g => hexo generate #生成
hexo s => hexo server #启动服务预览
hexo d => hexo deploy #部署 hexo server #Hexo 会监视文件变动并自动更新,无须重启服务器。
hexo server -s #静态模式
hexo server -p 5000 #更改端口
hexo server -i 192.168.1.1 #自定义IP
hexo clean #清除缓存,网页正常情况下可以忽略此条命令
hexo g #生成静态网页
hexo d #开始部署

Mac下使用GitHub+Hexo搭建个人博客的更多相关文章

  1. Linux下使用 github+hexo 搭建个人博客07-next主题接入搜索和站点管理

    这是搭建个人博客系统系列文章的最后一篇,如果你是从第一篇一路跟下来的,那么恭喜你,即将完成整个博客网站的搭建.OK,话不多说,开始我们的收官之战. 不知你想过没有,如果我们的文章少,一眼看完整个目录, ...

  2. Linux下使用 github+hexo 搭建个人博客06-next主题接入数据统计

    之前说了 next 主题的优化和接入评论系统.让我们完成了自己所需的页面风格和排版,也可让访问用户在每篇博文评论,完成博主和访问用户的交互. 本章我们继续讲解其他重要功能. 既然是一个网站,那么我们就 ...

  3. Linux下使用 github+hexo 搭建个人博客05-next主题接入评论系统

    静态站点拥有一定的局限性,因此我们需要借助于第三方服务来扩展我们站点的功能. 而评论系统是最常用于和网站用户交流的,因此本章讲解在 next 主题,如何接入评论系统. 参考网站:Next 使用文档,第 ...

  4. Linux下使用 github+hexo 搭建个人博客04-next主题优化

    上篇我们说了 hexo 的优化,针对的站点的优化. 本篇讲解 next 主题的优化,包括:使用语言.前端页面显示宽度.菜单.侧栏.头像.添加或取消动画效果.打赏功能等等. 让页面排版更符合我们所要的功 ...

  5. Linux下使用 github+hexo 搭建个人博客03-hexo配置优化

    上两张文章,我们说了 hexo 部署.主题的切换.博文的创建.MarkDown 简单使用和 hexo 部署到 GitHub Pages. 也说了我们会使用 next 主题做为我们后期博客的使用和维护. ...

  6. Linux下使用 github+hexo 搭建个人博客02-hexo部署到Github Pages

    之前的这篇文章<Linux下使用 github+hexo 搭建个人博客01-hexo搭建>,相信大家都知道怎么搭建 hexo ,怎么切换主题,并且完成了一篇博文的创建,以及 MarkDow ...

  7. Linux下使用 github+hexo 搭建个人博客01-hexo搭建

    为什么要搭建自己的博客系统? 原因有好几个吧,归类如下:1.自己搭建博客系统很有成就感,可以自己选定页面风格和页面排版: 2.自己搭建博客系统可以根据自己的需要添加各种插件功能,因此整体上比网上的第三 ...

  8. Windows下通过GitHub+Hexo搭建个人博客的步骤

    Windows下通过GitHub+Hexo搭建个人博客的步骤  https://blog.csdn.net/namechenfl/article/details/90442312 https://bl ...

  9. Github+Hexo,搭建专有博客

    前言 记得从大二开始,就一直想搭个专属网站,当时使劲抠页面[前端页面是从QQ空间抠的,现在想抠估计没这么容易了],写代码,忙活半天才把程序弄好. 可惜最终项目还是没上线,因为当时有两问题绕不开 需要购 ...

随机推荐

  1. Windows上使用jekyll+github搭建免费博客

    jekyll+github搭建个人博客 (一)下载Ruby (二)安装jekyll (三)开启jekyll服务器 (四)使用github展示博客 一.下载Ruby Ruby,一种简单快捷的面向对象(面 ...

  2. 一台电脑配置多个GigHub账号

    换了新的公司,原来的公司用SVN(比较老了),自己平时用码云(Gitee),新公司使用GitHub.前天通知我注册GitHub账号,但是并未通知用户名的事情(要求用自己的名字),原来的GitHub账号 ...

  3. UnityShader学习笔记- Stencil Buffer

    模板测试(Stencil Test)是现代渲染流水线的一环,其中涉及到的就是模板缓冲(Stencil Buffer),模板缓冲可以用来制作物体的遮罩.轮廓描边.阴影.遮挡显示等等效果 目录 Stenc ...

  4. Emgu.CV怎么加载Bitmap

    EmguCV 在4.0.1版本之后没办法用Bitmap创建Image了. 我给大家说下 EmguCV怎么加载Bitmap 下边是 EmguCV 官方文档写的,意思是从4.0.1以后的版本不能直接Bit ...

  5. Spring Cloud系列(三):Eureka源码解析之服务端

    一.自动装配 1.根据自动装配原理(详见:Spring Boot系列(二):Spring Boot自动装配原理解析),找到spring-cloud-starter-netflix-eureka-ser ...

  6. matlab中ischar确定输入是否为字符数组

    来源:https://ww2.mathworks.cn/help/matlab/ref/ischar.html?searchHighlight=ischar&s_tid=doc_srchtit ...

  7. minimist

    下载 minimistminimist 解析参数选项 这个模块是乐观主义者参数解析器的核心,没有所有的 奇特的装饰. 例子 var argv = require('minimist')(process ...

  8. 《流畅的Python》第三部分 把函数视作对象 【一等函数】【使用一等函数实现设计模式】【函数装饰器和闭包】

    第三部分 第5章 一等函数 一等对象 在运行时创建 能赋值给变量或数据结构中的元素 能作为参数传递给函数 能作为函数的返回结果 在Python中,所有函数都是一等对象 函数是对象 函数本身是 func ...

  9. 极简 Node.js 入门 - 4.5 双工流

    极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...

  10. SpringBoot+Activiti+bpmn.js+Vue.js+Elementui(OA系统审批流)

    引言:OA系统用到请假.加班.调休.离职,需要使用工作流进行流程审批 一:activiti流程设计器的选择(通过学习activiti工作流过程中,发现一款好的流程设计器将会更好的方便的设计好流程(主要 ...