前言

之前我的博客没有绑自己的域名,一直在github上放着,访问起来比较麻烦,前阵子在阿里云买了这个域名,配置上之后,就可以通过自己的域名访问了,有些朋友问我这个博客怎么搭的,用的什么主题,所以准备写一写博客的搭建过程,以及主题的配置,最后再说说域名的配置,这些内容一篇文章写起来有些费时间,打算分成三篇来写,跟着文章来走一遍过场,动手尝试搭建一个属于自己的Blog吧!


万丈高楼平地起,对于搭建Blog来说,环境的部署就是这高楼的基石,下面我们来看看怎么部署环境。

步骤总览

Git环境

  1. 如果您还没有注册GitHub,先到这里 GitHub注册教程 看我之前的文章
  2. 安装Git 点我下载 选择适合自己计算机环境的版本下载,我这里是Windows环境,下载后,根据提示点next一步步安装即可。关于Git的更多使用技巧,推荐看廖雪峰老师的Git教程 点我学习

Node环境

  1. 安装Node.js 点我下载 同样选择适合自己计算机系统的版本下载安装即可。更多Node.js教程 点我学习
  2. 安装完毕后,测试是否安装成功,打开命令终端,我这里是Windows,win+r输入cmd进入终端,键入命令node -v 或者直接输入node回车即可,如果出现下图显示则说明node环境安装成功:
  3. node中集成了npm包安装工具,输入命令npm -v查看版本号,如图:

Hexo环境

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。点我了解更多

  1. 安装hexo-cli:进入终端,键入命令 cnpm i hexo-cli -g [其中 ‘cnpm’ 代替 npm,安装速度更快; ‘i’ 表示install, ‘-g’表示全局安装 (注意:如果安装失败,建议在管理者模式下安装)]
  2. 初始化:在本地合适的位置创建一个文件夹用作Blog环境,比如,我这里在D盘根目录下创建了一个myblog文件夹,进入此目录,按住 shift 键同时点击鼠标右键打开Powershell终端,键入命令 hexo init 进行初始化,进度可能很慢[蹲个厕所回来大概就OK了],耐心等待安装即可。出现下图表示安装成功完毕后发现空目录多出很多文件,如下图:这里的node_modules是项目依赖,在初始化的时候已经下载下来了,不用再 hexo i 了(有的教程写的hexo i 就是安装依赖的作用)。

测试本地运行

上述环境完成后,我们就可以在本地预览blog了。很简单,两行命令。

  1. 键入命令 hexo generate 生成静态文件,可以简写为 hexo g
  2. 键入命令 hexo server 在本地运行, 可以简写为 hexo s
    出现下图则表示成功

  3. 打开浏览器,地址栏键入 http://localhost:4000 即可进行预览,效果如下

总结

经过以上操作,我们已经在本地搭建好了blog项目,并且在浏览器上预览成功,下一篇将接着写怎么把本地blog部署到github上,再换一个好看主题。

GitHub+Hexo搭建自己的Blog之-本地环境部署01相关推荐

  1. GitHub+Hexo搭建自己的Blog之(3)-主题配置(Next)

    GitHub+Hexo搭建自己的Blog之-主题配置(Next) 前言 Blog的环境全部搭建完毕了,但是还没有内容,而且hexo默认的主题是不是感觉挺丑的,其实hexo给我们提供了很多主题模板,总有 ...

  2. GitHub+Hexo搭建自己的Blog之-主题配置

    前言 前两章我们已经把Blog的环境全部搭建完毕了,但是还没有内容,而且hexo默认的主题是不是感觉挺丑的,其实hexo给我们提供了很多主题模板,总有一款是你喜欢的,本篇文章将继续说一说如何配置主题, ...

  3. 【完全指南】如何在Github上使用Hexo搭建自己的Blog

    [完全指南]如何在Github上使用Hexo搭建自己的Blog 一.在本地安装Hexo 1.简介: Hexo 是一个快速.简洁且高效的博客框架.Hexo 使用Markdown(或其他渲染引擎)解析文章 ...

  4. 使用github+hexo搭建静态blog

    解决了个人博客图片不显示问题. 解决了打开页面产生404问题. 学习了如何更换界面主题. 学习了如何使用Git. 注:这篇文章仅仅是入个门,了解一下怎么使用github+hexo创个静态blog,具体 ...

  5. GitHub+hexo搭建个人博客(2019新版超详细教程)

    GitHub+hexo搭建个人博客详细教程 原文链接 : GitHub+hexo搭建个人博客详细教程 前言 随着互联网浪潮的翻腾,国内外涌现出越来越多优秀的社交信息分享者,随之优秀的信息分享平台也越来 ...

  6. github+hexo搭建自己的博客网站(六)进阶配置(搜索引擎收录,优化你的url,添加RSS)...

    详细的可以查看hexo博客的演示:https://saucxs.github.io/ 绑定了域名: http://www.chengxinsong.cn hexo+github博客网站源码(可以clo ...

  7. GitHub+Hexo搭建个人网站

    title: GitHub+Hexo 搭建个人网站详细教程 date: 2019-04-13 13:42:36 tags: 个人网站 categories: 技术 搭建步骤: 获得个人网站域名 申请域 ...

  8. GitHub+Hexo 搭建个人网站详细教程

    原文链接 GitHub+Hexo 搭建个人网站详细教程 前言: 随着互联网浪潮的翻腾,国内外涌现出越来越多优秀的社交网站让用户分享信息更加便捷.然后,如果你是一个不甘寂寞的程序猿(媛),是否也想要搭建 ...

  9. Github+Hexo搭建个人博客(图文详解)

    文章目录 使用Github+hexo搭建个人博客(不会让小伙伴们走弯路) 1. 准备工作:安装两个我们本次所需要使用的软件: 2. 注册Github账号以及建立仓库:[https://github.c ...

最新文章

  1. RHEL7 kvm虚拟机桥接网络配置
  2. 成就PHP高手的五个必由之路
  3. 网页分享到微信、微博、QQ空间、百度贴吧等
  4. [SPOJ375]QTREE - Query on a tree【树链剖分】
  5. Qt-qwidget项目入门实例
  6. yaml for java_细数Java项目中用过的配置文件(YAML篇)
  7. C++ class实现链队列(完整代码)
  8. 使用三级缓存解决内存溢出
  9. java 泛型 接口_Java泛型(泛型接口、泛型类、泛型方法)
  10. 【iOS】Swift3 报错:Value of type 'AppDelegate' has no member 'managedObjectContext',UIApplication has no
  11. MyBatis学习总结_03_优化MyBatis配置文件中的配置
  12. 二级联动菜单(转载)
  13. IPv4子网划分基础
  14. 二级c语言vc2010下载,全国计算机等级考试二级C语言考试系统下载
  15. 无线鼠标指针乱跑一种解决方案
  16. 冰点还原无法修改计算机时间,设置冰点还原解冻期间方法
  17. 各运营商虚拟主机对比_满足您需求的最佳虚拟主机提供商
  18. 图像调优2:什么是10° D65 和 2° D65
  19. 相机调试-tuning常见缩写汇总
  20. TIA博途中如何通过画面编号+变量更改事件实现画面跳转?

热门文章

  1. java 查询功能实现的八种方式
  2. Docker:集装箱式“运输”在软件上的实现
  3. 事务相关、不可重复读与幻读的区别
  4. Base64转PDF、PDF转IMG(使用pdfbox插件)
  5. 关于datagrid
  6. Android报“android.content.res.Resources$NotFoundException: String resource ID #0x2”错误
  7. iOS应用如何支持IPV6
  8. 机器学习:最大似然估计与最大后验概率估计
  9. 台北到淡水版Firefox无法播放视频
  10. 如何用参数化SQL语句污染你的计划缓存