Windows下通过GitHub+Hexo搭建个人博客的步骤
程序员文章站
2022-04-17 17:46:12
...
如何从一无所有开始搭建个人博客
1. 注册GitHub账号
2. 安装Git
3. 创建个人博客
3.1 什么是GitHub Pages
Github Pages 是面向用户、组织和项目开放的公共静态页面搭建托管服务,站点被免费托管在GitHub上,可以使用Github Pages默认提供的域名github.io 或者自定义域名(域名需要买买买)来发布站点。
3.2 创建GitHub Pages
3.2.1 在自己的GitHub上创建一个repository
- New repository
-
Repository name 必须是 GitHub用户名.github.io
- 如上截图,点击下方的Create repository按钮即可完成创建
3.2.2 Git clone 创建的repository到本地
- 首先创建SSH key
- 在自己的电脑上选择一个合适的位置或创建一个文件夹,用来存放本地的repository。
打开上述在GitHub上创建的repository,Clone or download
→Clone with SSH
复制SSH地址
在本地repository的文件夹下,鼠标右键点击空白处,选择git bash,
通过git clone 复制的SSH地址
复制到本地。
3.2.3 在repository根目录下写一个简单的HTML文件
例如:
3.2.4 将repository的改动推送给GitHub上的repository
在本地repository目录下,依次进行以下三个操作:
git add .
git commit -m
git push
3.2.5 访问地址https://GitHub用户名.github.io
,就能读取到最基本的个人网页
4. 安装Node.js
5. 安装Hexo
6. 本地搭建博客
在电脑上找个合适位置或者新建文件夹,用来存放之后创建的博客。
在博客文件夹下,打开git bash
6.1 初始化博客框架:hexo init
会自动生成如下文件:
6.2 生成静态文件
hexo generate
/hexo g
6.3 启动服务器,本地预览博客效果
hexo server
/hexo s
7. 发布文章
hexo new [layout] <title>
可以在命令中指定文章的布局(layout),默认为 post,可以通过修改 _config.yml 中的 default_layout 参数来指定默认布局。
根据不同的布局,会在不同的路径下生成title.md
文件
布局 | 路径 |
---|---|
post | source/_posts |
page | source |
draft | source/_drafts |
生成的文件如下: title
是文章的标题,tags
是标签,还可以添加categories
分类,对发表的博文进行归纳整理。 ---
分割线之后的部分就是文章的内容。可用Markdown语法*编辑。
8. 将网站部署到个人的GitHub Pages上
8.1 安装hexo-deployer-git
npm install hexo-deployer-git --save
8.2 修改_config.yml
文档中deploy
的配置
按照如下格式(yml文件的格式,属性后紧跟:
,空一格再写属性值)
deploy:
type: git # git方式部署
repo: <repository url> # repository地址,即 GitHub用户名.github.io库 的SSH地址
branch: [branch] # 分支名称,master即可
message: [message] # 自定义提交信息 (默认为提交的时间)
修改为
8.3 hexo deploy
或hexo d
完成部署
将本地的静态网页部署到服务器上,即可通过https://GitHub用户名.github.io
访问部署出来的页面。
9. Hexo框架下用NexT(v6.0+)主题美化博客
推荐阅读
-
LNMP小项目搭建,Centos7.6环境搭建Linux+nginx+mysql+php,wordpress个人博客的搭建(完整搭建步骤)
-
Windows下快速搭建NodeJS本地服务器的步骤
-
六个步骤,从零开始教你搭建基于WordPress的个人博客
-
WINDOWS下搭建SVN服务器端的步骤分享(Subversion)
-
github+hexo的个人博客搭建教程
-
Docker实现从零开始搭建SOLO个人博客的方法步骤
-
Windows下使用VMWare搭建Linux环境的步骤(图文)
-
Python入门开发教程 windows下搭建开发环境vscode的步骤详解
-
LNMP小项目搭建,Centos7.6环境搭建Linux+nginx+mysql+php,wordpress个人博客的搭建(完整搭建步骤)
-
Windows7下的Java开发环境搭建步骤(图解)