Hexo从0到1搭建博客系列01:浅尝Hexo

简介: Hexo从0到1搭建博客系列01:浅尝Hexo

Hexo从0到1搭建博客系列01:浅尝Hexo

1. 前言

作为一个程序员,我们总是想记录一些自己日常学习的东西、自己对于技术的思考以及自己平时折腾的一些小项目。但是自己手动搭建一个博客是很费时费力的一件事情,我们需要考虑一下几点难题:

  1. 制作一个博客网站需要这些技术:后端采用 SpringBoot 全家桶,前端采用 Vue/React 。如果追求快速搭建一个博客,可以使用全栈 nodejsegg.jsexpresskoa 等)。如果想让博客功能更强大,需要引入更多的技术。但这些技术的学习都很耗时费力,极可能劝退。
  2. 如果想让博客页面更好看,需要自己设计 UI
  3. 博客最终展示给别人,需要部署到服务器上才能让大家看到。需要买服务器、买域名、域名备案、学习部署知识等等。
  4. 服务器后期需要维护,一年维护费用可能几百至上千不等。
  5. 服务器被人恶意攻击( DDOSSQL注入 等),需要自己手动解决或花钱升级服务器。

如果你想要通过博客项目,以此学习前后端的知识、提升自己的编程水平甚至是将其作为一个简历上可以拿得出手的项目,我强烈建议你将以上步骤逐一完成,甚至可以将个人博客延伸为社交博客论坛(类似 CSDN掘金 等),引入微服务与分布式技术。将这些做完,绝对会有明显的技术提升。

但是,如果你只想有一个自己的网站去记录一些日常的学习等内容,继续往下看,我将会使用 Hexo 简化以上流程,从0到1实现一个美观精致高效的博客。

2. Hexo简介

首先简单介绍一下 Hexo

引自[官方](文档 | Hexo)

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

其实 Hexo 就是帮我们完成了大部分与书写博客无关的事情,我们只需要根据 Hexo 现有的框架,做一些简单的配置,即可做出一个博客网站。之后,我们就可以专注地写自己的博客啦

在接下来的部分中,你只需要有以下几点前置知识,即可快速完成之后系列的全部内容:

  1. Node.js:主要用于安装Hexo、发布文章、部署等操作安装 Node.js
  1. 官网安装
  2. Mac可采用 Homebrew 安装
  1. GitGithub:最后的博客网站将发布到 Github
  2. Markdown:这个很简单,在 CSDN 或者用Typora写过博客的人都知道怎么用

之后全部的实战部分,均采用 VSCode 编辑器完成。如果你熟练使用命令行操作,也可以直接在命令行上完成全部操作。

3. Hexo简单实战

  1. 首先打开命令行窗口,执行以下命令,安装Hexo。
  2. ruby
  3. 复制代码
$ npm install -g hexo-cli

image.png

  1. 选择一个合适的位置(之后博客全部文件所在的地方),执行以下命令。
    这里我博客命名为ltyzzz-blog
$ hexo init ltyzzz-blog
$ cd ltyzzz-blog
$ npm install
  1. 通过 VSCode 打开创建好的博客目录

image.png

diff

复制代码

介绍其中几个重要的文件:-   _config.yml:博客相关的配置均在这个文件中(之后引入Fluid主题后有所变化)-   source:用来存放用户资源的位置(我们写的文章就存储在这里)
  1. 执行以下命令,生成静态网页文件 public
  2. ruby
  3. 复制代码
$ hexo generate
  1. 执行以下命令,在本地服务器(默认为:http://localhost:4000/)启动博客
  2. ruby
  3. 复制代码
$ hexo server

最终Hexo基础博客页面如图所示:

image.png

看到这里,是不是感觉Hexo页面十分的简陋甚至有点丑?

没关系,之前的部分只是带大家简单尝试一下Hexo,了解一下基本的框架与命令使用。

我们的重头戏将放在Fluid主题,通过该主题熟悉Hexo核心功能以及Fluid新增的功能。

接下来的内容包括有:

  1. 博客文章的编辑与发布
  2. 评论区功能模块引入
  3. 图床的最佳实践
  4. 新增留言板界面
  5. 将博客部署到Github

4. 后记

如果大家觉得我的内容写的还不错,可以在评论区留言支持一下呀~

这个系列还有几篇,会慢慢更新完的~

以后还会继续和大家分享一些编程方面的知识干货~


相关文章
|
JavaScript 前端开发
Layui 弹层组件 - 基础参数1
Layui 弹层组件 - 基础参数1
280 0
|
网络协议 算法 网络架构
计算机网络期末复习——基础知识汇总(二)
计算机网络期末复习——基础知识汇总(二)
218 0
|
网络协议 网络架构
计算机网络期末复习——计算大题(一)
计算机网络期末复习——计算大题(一)
798 0
计算机网络期末复习——计算大题(一)
|
分布式计算 Hadoop
hadoop 的启动和停止命令(史上最全)
sbin/start-all.sh 启动所有的Hadoop守护进程。包括NameNode、 Secondary NameNode、DataNode、ResourceManager、NodeManager sbin/stop-all.sh 停止所有的Hadoop守护进程。包括NameNode、 Secondary NameNode、DataNode、ResourceManager、NodeManager sbin/start-dfs.sh 启动Hadoop HDFS守护进程NameNode、SecondaryNameNode、DataNode sbin/stop-dfs.sh 停止Hadoop
|
8月前
|
传感器 人工智能 运维
2025年最新设备巡检系统评测,哪款更适合你
本文将从评测角度,带你了解各类设备巡检系统的特点和适用场景,并重点剖析草料二维码的优势,帮助企业在预算、环境和技术水平等因素下,选择最适合的巡检方案。
|
存储 监控 固态存储
【vSAN分布式存储服务器数据恢复】VMware vSphere vSAN 分布式存储虚拟化平台VMDK文件1KB问题数据恢复案例
在一例vSAN分布式存储故障中,因替换故障闪存盘后磁盘组失效,一台采用RAID0策略且未使用置备的虚拟机VMDK文件受损,仅余1KB大小。经分析发现,该VMDK文件与内部虚拟对象关联失效导致。恢复方案包括定位虚拟对象及组件的具体物理位置,解析分配空间,并手动重组RAID0结构以恢复数据。此案例强调了深入理解vSAN分布式存储机制的重要性,以及定制化数据恢复方案的有效性。
329 5
|
Ruby
GitLab: Push operation timed out
本文描述了在推送AOSP源码到GitLab时遇到的超时问题,并提供了通过在GitLab服务器上禁用LFS检查功能来解决这个问题的方法。
309 1
|
10月前
|
机器学习/深度学习 自然语言处理 文字识别
方案测评 | 多模态数据信息提取极速体验
多模态数据信息提取方案基于先进AI技术,能高效处理文本、图像、音频和视频等不同格式文件,提取有价值信息。该方案通过深度学习、自然语言处理等技术,实现结构化信息挖掘与分析,支持批处理模式,显著提高大规模数据处理效率,降低业务成本。用户可通过阿里云平台一键部署,无需数据搬运,确保高效安全的数据处理体验。此方案在性能和易用性上表现出色,具有广泛的应用价值和市场前景。
下一篇
oss云网关配置