如何搭建个人网页（零）—— 开始

发表于 2024-12-12 更新于 2024-12-24 分类于个人网页搭建阅读次数： Waline：本文字数： 1.5k 阅读时长 ≈ 3 分钟

这系列文章主要讲讲如何从零开始搭建个人网页，其实也就是本网站是如何被搭建起来的，当然作者也是这几天从零开始一点点尝试的，所以有很多地方可能还不成熟或者有问题，请谅解。

本文是一个开始，主要介绍下我们需要用到哪些技术和工具。

首先，你在开始之前，应当已经了解以下知识：

**Node.js 和 NPM：**Node.js 是一个 JavaScript 运行环境，NPM 是其包管理器。Hexo 的运行和插件安装都依赖于 Node.js 和 NPM。
**Git：**Git 是一个分布式版本控制系统，用于管理代码和项目的变更。搭建网站时，Git 可以帮助我们在本地开发后将代码推送到远程仓库（如 GitLab）。
**Github或Gitlab：**GitHub 和 GitLab 是两款广泛使用的代码托管和协作平台，帮助开发者管理项目、版本控制和团队协作。如果你比较了解Github，那Gitlab对你而言也会很熟悉。
**Markdown：**Markdown 是一种轻量级的标记语言，使用简单的语法即可快速编写格式化的文本。这里我们所有的博客其实都是一份份Markdown文件（简称md），因此你需要掌握基本的Markdown语法。

此外，本系列文章中的教程大多基于我的配置编写，文中提到的许多内容需要根据你的实际情况进行调整。我使用的是 Windows 11，如果你使用的是 Linux 或 macOS，有些地方也需要进行相应的调整。

我的实现方案由以下组成，这些内容在接下来的文章中都会一一讲解。

Hexo：Hexo 是本系列的主角，它是一个快速、简洁且功能强大的静态博客框架，主要用于生成静态网页，其优势就是简单便捷，不需要写任何的前后端代码。
Hexo NexT：Next 是 Hexo 的一款主题，其特点是简洁清晰美观，可扩展性强。
**Gitlab Pages：**GitLab Pages 提供免费的静态网站托管服务。我们可以将 Hexo 生成的静态文件上传到 GitLab，利用其 CI/CD 管道自动部署到 Pages 上，然后就能访问到我们的网站了。当然，GitLab Pages只是可选的方案之一，也有其他方法。
**阿里云域名（可选，付费）：**虽然Gitlab Pages会提供一个网址（例如jinqq.gitlab.io）让我们能访问网站，但是如果有个性化域名（例如jinqiqing.cn)就更好了，一个.cn域名首次购买现在是39元/两年，.com域名就贵了，大概要89元/两年。
阿里云OSS（可选，付费）：直接在markdown文件里插入的图片都是存在本地的，所以其他人是无法看到图片的，因此需要一个云服务图床来存储这些图片，阿里云OSS（对象存储服务）40G大概是27元/三年。此外阿里云OSS也有静态网站托管服务，可以用来替代Gitlab Pages，这一点在第六章有阐述。

确保你的电脑上安装好了node.js和npm，建议较新版本，输入以下命令确认：

1 2	node -v npm -v

确保你的电脑上安装有git，同时配置好了ssh，这里不详细展开了。

确保你拥有一个Gitlab账号，当然如果你不打算将网页布置Gitlab Pages上就不需要了。

Typora 应该是最好用的markdown编辑器之一了。不过Typora要付费购买（89元/永久），也可以用vscode的插件来代替。（如果你是markdown语言大神的话

接下来就要从零开始搭建个人网页了，首先从我们的主角Hexo开始。