热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

快速搭建个人博客

Hexo+Github+域名绑定+MaterialTheme快速搭建个人博客.整个搭建过程还是算比较简单的,按照官方文档一步一步来,绑定域名时遇到了一些小坑以下为大概步骤记录:流程

Hexo+Github+域名绑定+Material Theme 快速搭建个人博客.
整个搭建过程还是算比较简单的,按照官方文档一步一步来,绑定域名时遇到了一些小坑以下为大概步骤记录:


流程



  • Node.js 环境

  • Git 环境

  • GitHub 注册和配置

  • Hexo 安装配置

  • 关联 Hexo 与 GitHub Pages

  • GitHub Pages 地址解析到个人域名

  • Material Theme 主题配置

  • Hexo 的常用操作


Hexo 安装配置



  • 官方文档


关联 GitHub Pages



  • 新建Github仓库,例如我的 blog

  • 在该仓库中新建一个文件如README,然后在仓库设置settings中找到GitHub Pages,选择master分支后保存

  • 在Hexo配置文件中关联你的Github项目,注意此时未绑定域名时的配置,否则会造成样式丢失或404,例如:








    1
    2

    url: https://exrick.github.io/blog
    root: /blog/











1
2
3
4

deploy:
type: git
repo: https://github.com/Exrick/blog.git
branch: master


  • 安装 hexo-deployer-git








    1

    $ npm install hexo-deployer-git --save



GitHub Pages 地址解析到个人域名



  • 购买域名后进入域名解析设置,本人以腾讯云为例:

  • 注意此时绑定域名后Hexo的配置,否则会造成样式丢失或404,例如:










1
2

url: http://blog.exrick.cn
root: /


  • 在hexo项目根目录下的source文件夹中新建名为 CNAME 没后缀名的文件,其中内容编辑为你绑定的域名,例如 blog.exrick.cn;或者在Github设置页面的Github Pages找到Custom domain 填入你的域名


Material Theme 主题配置



  • 个人很喜欢的原生主题 viosey大神作品

  • Material Theme官方文档


Hexo 的常用操作



  • 创建新文章










1

$ hexo new "My New Post"


  • 运行本地服务器查看










1

$ hexo server


  • 生成静态文件










1

$ hexo generate


  • 部署到远程










1

$ hexo deploy


  • 常用组合命令










1
2

$ hexo clean
$ hexo d -g

更多命令: 中文官方文档



推荐阅读
  • nvmw安装,用于控制node版本;
    之前一直使用的是nodev2.2.0版本,挺说新版本的node解决了npm安装插件产生文件夹结构过深的问题,所以就想更新试试;上网一看才发现,尼玛的node已经到了6.+版本了,好 ... [详细]
  • Todo-react-redux-immutable综合运用react,redux,react-redux,immutable.js,styled-components等工具库,完 ... [详细]
  • 如何运行vue项目(github项目),Go语言社区,Golang程序员人脉社 ... [详细]
  • 开发笔记:(源码开放) React + webpack3 多页面应用 及 常见问题解答
    本文由编程笔记#小编为大家整理,主要介绍了(源码开放)React+webpack3多页面应用及常见问题解答相关的知识,希望对你有一定的参考价值。 ... [详细]
  • 【Zabbix4.2学习笔记】1、CentOS7.5安装zabbix4.2
    1、关闭防火墙和selinux#systemctlstopfirewalld#vimetcselinuxconfigSELINUXpermissive#setenforce02、添加zabbix存储库rpm-Uvhh ... [详细]
  • 篇首语:本文由编程笔记#小编为大家整理,主要介绍了MongoDB快速入门教程(4.1)相关的知识,希望对你有一定的参考价值。4 ... [详细]
  • 系统管理部分软件包管理进程管理服务管理磁盘管理系统管理之软件包管理软件包的安装方式yumapt方式rpmdpkg方式编译安装方式二进制安装方式rpm安装方式增删改查安装:-ivh查 ... [详细]
  • 这篇文章将为大家详细讲解有关python爬虫中scrapy怎么处理项目数据,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有 ... [详细]
  • 跪服!大四学生开发了一整套文言编程
    机器之心报道参与:思、Jamin用文言文写的官方编程教程《文言陰符》,类似pip那样的包管理工具「文淵閣」,还有文言编程开源IDE「文言齋 ... [详细]
  • 怎么使用提高开发效率的VSCode插件
    这篇文章将为大家详细讲解有关怎么使用提高开发效率的VSCode插件,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所 ... [详细]
  • Fixes#3560Itriedtodowhatproposedintheissue(inthisbranchhttps://gith ... [详细]
  • 一、vue-resource1、引入资源方式1)下载vue-resource.js,添加到项目中2)CDN:http:www ... [详细]
  • 【scrapy】爬取汽车车型数据
    汽车最近想在工作相关的项目上做技术改进,需要全而准的车型数据,寻寻觅觅而不得,所以就只能自己动手丰衣足食,到网上获(窃)得(取)数据了。汽车之家是大家公认的数据做的比较好的汽车网站 ... [详细]
  • 本文介绍了Composer依赖管理的重要性及使用方法。对于现代语言而言,包管理器是标配,而Composer作为PHP的包管理器,解决了PEAR的问题,并且使用简单,方便提交自己的包。文章还提到了使用Composer能够避免各种include的问题,避免命名空间冲突,并且能够方便地安装升级扩展包。 ... [详细]
  • 本文详细介绍了如何创建和使用VUE uni-app开发环境,包括通过HBuilderX可视化界面和通过vue-cli命令执行的方法。文章内容简单清晰,易于学习与理解。通过学习本文,读者可以深入了解VUE uni-app开发环境,并通过实践验证掌握具体的使用情况。编程笔记将为读者推送更多相关知识点的文章,欢迎关注! ... [详细]
author-avatar
王丹__-划_402
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有