从 0-1 教你利用服务器做属于自己的个人博客

本文涉及的产品
云防火墙,500元 1000GB
简介: 引子大家好,我是坚果。如果你迷惘。微信搜“坚果前端”公众号,看看码农的轨迹因为学习 IT 技术还是想应用到学习、工作、生活中,让它们更美好,就应该授人以渔,毕竟自己动手了才有收获

引子

大家好,我是坚果。如果你迷惘。微信搜“坚果前端”公众号,看看码农的轨迹


因为学习 IT 技术还是想应用到学习、工作、生活中,让它们更美好,就应该授人以渔,毕竟自己动手了才有收获


先给大家分享一下我与我的粉丝的部分聊天记录


image.png


image.png


image.png


通过这些记录就是告诉大家,不论学历咋样,不论专业是不是计算机,只要有一个爱钻研的心,不惧困难,你都可以搭建属于自己的一个简单博客,

正文

今天的这篇教程是基于 windows 服务器进行的


由于帮助的是一位非计算机专业的学生,所以觉得 windows 会更适用


先来看一下成功后的截图

image.png


前提条件

  • 购买服务器
  • Node.js
  • Git
  • 当然如何安装 git 和 Npm 我也会在本教程指出。


在搭建个人博客之前默认大家已经购买并成功登录了服务器(搭建个人博客的所有操作中,除对云服务器控制台的相关设置是在我们本地电脑上操作外,其余均在服务器上进行),


关于如何远程连接自己购买的服务器,大家可观看小编往期发布的教程进行对应操作


小编所使用的是 windows 操作系统的阿里云服务器,详细参数如下图所示,供大家参考


搭建博客的前提:安装 Node.js 和 git 两个软件

一、首先下载并安装软件 Node.js

历史版本网址如下:https://nodejs.org/zh-cn/download/releases/

复制到浏览器打开即可

这里小编推荐大家安装 12.12 左右的版本,

主要是太新的版本,目前 hugo,gitbook。hexo 的支持都不太好


截至写这篇文档前,最新的版本为 16.13.0


image.png


下图所示,由于页面太多,我们先点击第 4 页,以浏览后面的页面,找到 12.12 左右的版本


image.png


如下图所示,点击至第 7 页,理由同上


image.png


如下图所示,在点击到第 10 页时,我们可以看到有 12.12 左右的版本


此时我们选择 12.12.7 版本下载,如图所示点击下载


image.png


跳转至如下页面后点击图上所指的链接进行下载


image.png


下载中,等待安装包下载完成后打开安装


image.png


点击“打开文件”进行安装


image.png


若弹出如下页面,点击“是”,允许应用对设备进行更改即可!


image.png


安装界面如下图所示,点击 Next


image.png


点击勾选下图所示方框,后继续点击“Next”


image.png


选择默认,点击“Next”两次后显示界面如下:


按下图中所示,勾选方框后点击“Next”。


image.png


点击下图中箭头所指的“Install”按钮进行安装


image.png


等待安装完成


image.png


点击 Finish 完成安装


image.png


安装完成后出现如下弹窗,点击右上角叉号关闭即可!


image.png


按住键盘上的 Win+R 键,输入命令“cmd”后回车确定,


紧接着在打开的命令行中输入命令“node -v”后回车确定,以检查 Node.js 是否正确安装


image.png


已安装的软件版本会如下图显示出来,同之前下载的软件版本一致,则证明安装正确


image.png

二、接下来我们安装另一个必备软件:git

网址如下:https://git-scm.com/   复制到浏览器打开即可


点击图示按钮下载 git 安装包


image.png


等待下载完成……


image.png


点击“打开文件”运行安装


image.png


若弹出如下页面,点击“是”,允许应用对设备进行更改即可!


image.png


安装界面如下,一直点击 Next,直至安装完成,所有勾选保持默认即可!


image.png


点击 Install 进行安装


image.png


等待安装完成


image.png


下图中的方框保持默认或不勾选均可,点击“Finish”按钮,完成安装


image.png


至此,git 这一软件我们也安装完成了!


此外我们还需要安装用来部署博客的软件,有以下几种可供大家选择,gitbook 、hugo、 hexo 、docifsy。这里小编推荐大家安装 hexo 这一软件、


当然需要其他教程的,大家也可以

三、安装 hexo

官方地址:


https://hexo.bootcss.com/


按住键盘上的 Win+R 键,输入命令“cmd”后回车确定,


紧接着在打开的命令行中输入命令“npm install hexo-cli -g”后回车确定


这是全局安装的命令


npm install hexo-cli -g

复制代码


运行中,等待安装完成


待运行完成后输入“hexo version”命令,回车运行


显示如下图所示即为安装正确


image.png


至此,搭建博客所需要的软件我们已安装完毕,接下来我们就可以用前面安装好的软件来部署我们的个人博客了!

四、部署个人博客(建站)

安装 Hexo 完成后,请执行下列命令,Hexo 将会在指定文件夹中新建所需要的文件。


hexo init jianguo cd jianguo npm install

复制代码


新建完成后,指定文件夹的目录如下:


.├── _config.yml├── package.json├── scaffolds├── source|   ├── _drafts|   └── _posts└── themes

复制代码


在这儿,不讲解过多的 hexo 命令以及它的配置


直接启动服务器。默认情况下,访问网址为: http://localhost:4000/


hexo server

复制代码

五、对服务器的防火墙进行相关配置

如下图所示,在服务器桌面左下角搜索“防火墙和网络保护”,查找到后点击进入设置


image.png


将页面拉至最低端,点击进入“高级设置”选项


image.png


先点击“入站规则”,然后点击进入“新建规则”选项


image.png


跳转至如下页面,在规则类型一栏下,选中端口后点击“下一步”


image.png


我们在下图所指示的框内输入我们想要使用的端口,小编这里输入 4000 作为示范,然后点击“下一步”


image.png


跳转至如下页面,我们选中“允许连接”后继续“下一步”


image.png


继续“下一步”


image.png


在下图所指出的框内输入名称和对网站的描述(网站的描述也可不填)后点击“完成”


image.png


如下图所示,新的规则已经创建成功


image.png


如下图所示,我们点击“刷新”


image.png


至此我们就完成了对防火墙的相关设置,接下来我们对阿里云服务器控制台进行相应的设置


如果想偷懒,可以一次性打开所有端口

image.png


六、对云服务器控制台进行相应设置

接下来对云服务器控制台的相关操作我们需要切回本地电脑并登录阿里云服务器控制台来进行


登录阿里云进入到云服务器控制台后,如下图所示,点击进入“实例”一栏后点击我们云服务器的实例 ID 进入实例


image.png


切换至如下页面,点击“配置安全组规则”


image.png


切换至如下页面,点击“配置规则”


image.png


切换至如下页面,如图所示依次点击进行

我这儿是偷懒做法,所有一次性全部打开了

image.png


跳转至如下界面,将图中所标示的地方同下图配置一致,点击“确定”,端口配置完成


image.png


上述方式是打开了服务器的所有端口,比较便利,如果大家有安全方面的考虑,

我们也可以只打开一个端口用于外部访问,步骤如下:

按照下图所示依次点击进行操作


image.png


按照下图所示依次进行配置,因为之前在第五步(对服务器的防火墙进行相关配置)中,我们设置的端口是 4000,所以在“端口范围”à“目的”一栏这里我们也需要对应设置为 4000,其余参数同下图保持一致,点击 “保存”即可


image.png


如下图所示,可以看到我们规则已经创建完成


image.png


七、运行之前部署的网站


切换到服务器上,回到之前部署网站的文件夹,右键选择“Git Bash Here”选项,打开 git 进行运行,输入“hexo s”命令回车运行


image.png


如下图显示,所建的网站已经在服务器上运行了起来,此刻我们便可以通过我们所建网站的 IP 地址在浏览器上进行访问了,网址形如:http://8.142.39.12:4000  (http://服务器的 ip 地址:端口)


image.png


访问效果如下:


image.png


至此,我们的个人博客就搭建成功了


要编写博客,我们还需要一款编辑软件,

七、Typora

小编推荐使用 Typora 这一软件,


网址为https://typora.io/#windowsTypora — a markdown editor, markdown reader.)复制至浏览器打开下载即可,


此处不再赘述。


这个问题就记录到这儿,


这是一个帮助粉丝解决问题的过程,也是程序员在编程之路上的点滴记录,如果那个粉丝想定制更高端的博客,我也会提供相应的教程。

相关文章
|
2月前
|
固态存储 安全 程序员
搭建程序员个人博客网站的服务器配置怎么选?
搭建个人博客网站时,合理选择服务器配置至关重要。推荐1核CPU、2GiB内存、SSD硬盘及2M-10M带宽,适合大多数个人博客。操作系统方面,Linux更为经济高效。建议选择如阿里云等知名云服务商,同时考虑服务器的可扩展性和安全性,确保网站稳定运行与良好体验。
|
2月前
|
运维 安全 Linux
怎么使用云服务器搭建个人博客网站
使用云服务器搭建个人博客网站是一个涉及多个步骤的过程,包括购买云服务器、域名注册和备案、环境配置、安装博客系统、部署SSL证书以及网站上线和维护。通过选择合适的云服务提供商(如阿里云、腾讯云等),配置服务器,安装宝塔面板,选择合适的博客程序(如Typecho、WordPress等),并确保安全措施到位,您可以成功搭建并运行自己的个人博客网站。
|
7月前
|
域名解析 弹性计算 数据安全/隐私保护
阿里云ECS免费搭建WordPress个人博客网站
阿里云ECS免费搭建WordPress个人博客网站
725 2
阿里云ECS免费搭建WordPress个人博客网站
|
2月前
|
域名解析 网络协议 数据安全/隐私保护
阿里云轻量应用服务器搭建WordPress个人博客教程
阿里云轻量应用服务器搭建WordPress个人博客教程
|
2月前
|
域名解析 弹性计算 程序员
想要轻松地搭建一个即开即用的WordPress博客吗?借助宝塔面板镜像+阿里云ECS,迅速拥有自己的个人博客
拥有个人博客是每位程序员的梦想,但对服务器不熟悉的初学者而言,搭建博客颇具挑战。本文介绍利用阿里云市场的宝塔面板镜像与ECS云服务器,轻松搭建WordPress博客的方法,让您快速拥有专属博客空间。通过简单的操作步骤,即使是新手也能轻松上手,实现从零到有的博客搭建过程。
219 3
|
5月前
|
关系型数据库 Linux 数据库
如何在Linux云服务器上通过Docker Compose部署安装Halo,搭建个人博客网站?
本文指导用户如何在Linux服务器上使用Docker Compose部署Halo博客系统。首先确保拥有Linux服务器并安装Docker及Docker Compose。接着创建文件夹(例如`~/halo`),用于存放所有Halo相关数据。可以选择不同的Halo Docker镜像源,推荐使用具体版本而非`latest`标签以避免误操作。示例中提供了三种`docker-compose.yaml`配置方法:Halo+PostgreSQL、Halo+MySQL以及使用默认的H2数据库。每种配置都包括网络设置、健康检查和环境变量。
246 1
|
7月前
|
弹性计算 运维 负载均衡
阿里云轻量应用服务器产品简介、收费标准与活动价格、搭建个人博客教程参考
阿里云轻量应用服务器是深受个人和普通企业用户亲耐的一款轻量级云服务器产品,提供精品应用一键部署,支持一站式的域名、网站、安全、运维、应用管理等服务,极大优化搭建简单应用的体验,降低了入门级用户使用云计算产品的门槛。本文来介绍全方位介绍一下阿里云轻量应用服务器的产品知识,以及最新的收费标准与活动价格情况,另外再奉上使用轻量应用服务器搭建个人博客的建站教程,以供参考。
阿里云轻量应用服务器产品简介、收费标准与活动价格、搭建个人博客教程参考
|
7月前
|
存储 前端开发 搜索推荐
在自己的服务器上部署个人博客和开源项目:实现数字存在感
在自己的服务器上部署个人博客和开源项目:实现数字存在感
|
数据库 容器
本地电脑搭建web服务器、个人博客网站并发布公网访问 【无公网IP】(1)
本地电脑搭建web服务器、个人博客网站并发布公网访问 【无公网IP】(1)
325 0
|
7月前
|
弹性计算 关系型数据库 应用服务中间件
大咖与小白的日常:手把手教你在阿里云ECS上搭建个人博客
小白的玩摄影的男朋友要做毕业设计,小白想给他搭建一个线上个人展厅。大咖推荐了ECS+WordPress,超快上手!
185 5
大咖与小白的日常:手把手教你在阿里云ECS上搭建个人博客