免费使用阿里云服务器快速搭建自己的个人网站

开通阿里云服务器（部署服务器）

推荐：阿里云登录 - 欢迎登录阿里云，安全稳定的云计算服务平台
在这里插入图片描述

选择【2核(vCPU) 2GiB | 经济型 e | ESSD Entry 40GiB】，几乎能用2-3个月

第一步：远程连接到你的云服务器

从阿里云控制台找到刚刚开通的ECS实例，公网IP地址
在这里插入图片描述

重置实例密码，设置后根据提示重启实例以使密码生效。

在本机打开终端：

Windows：按 Win + R 键，输入 cmd 回车，打开命令提示符。

Mac：键盘按下 Command + 空格键 搜索 Terminal（终端）并打开。

输入连接命令
在终端中输入以下命令（将你的公网IP 替换为真实的 IP），然后回车：

ssh 用户名@你的公网IP

首次连接会提示 Are you sure you want to continue connecting (yes/no/[fingerprint])?，输入 yes 并回车。
接着会提示输入密码，注意：输入密码时屏幕上不会显示任何东西（连星号都没有），这是 Linux 的安全保护机制。摸黑输完你的密码后直接敲回车。

当看到屏幕前缀变成 用户名@xxxx:~# 时，说明你已经成功“住”进了这台香港的云服务器里

第二步：放行服务器防火墙安全组

网页服务默认使用 80 端口。阿里云为了安全，默认是把所有端口都堵死的，我们需要去控制台开个门。

回到阿里云 ECS 控制台，在左侧菜单或实例详情页找到 “安全组”。
点击 “配置规则” -> “手动添加”。
协议类型选择 HTTP (80)，源地址选择 **目的/源：0.0.0.0/0（**代表允许所有人访问）。
点击保存。

第三步：安装并启动 Nginx

现在回到你刚刚连接好的黑色终端窗口，依次复制并运行以下命令（如果你装的是 Ubuntu/Debian 系统）：

更新服务器的软件源列表
```
apt update
```
安装 Nginx 软件：
```
apt install nginx -y
```

启动 Nginx 并设置开机自启：

systemctl start nginx
systemctl enable nginx

打开你手机或电脑的浏览器，在地址栏直接输入 http://你的公网IP 然后回车。如果一切顺利，你会看到一个白底黑字写着 “Welcome to nginx!” 的网页。

这意味着，你的服务器已经成功变成了一个 Web 服务器

第四步：把 “Welcome” 变成你自己的名片网页

Nginx 默认展示的网页文件存放在服务器的 /var/www/html 目录下

进入网页存放的目录： cd /var/www/html
把原来的默认网页备份： mv index.nginx-debian.html index.nginx-debian.html.bak
新建并编辑你自己的网页文件： Linux 自带一个叫 nano 的极简文本编辑器，输入以下命令新建 index.html： nano index.html
写入你的第一个名片测试代码：在弹出的空白编辑界面中，右键粘贴（或者手打）以下这段简单的 HTML 代码：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的智能名片</title>
    <style>
        body { font-family: Arial, sans-serif; text-align: center; margin-top: 50px; background-color: #f4f4f9; }
        h1 { color: #333; }
        .link-btn { display: inline-block; padding: 10px 20px; margin: 10px; background-color: #10ab61; color: white; text-decoration: none; border-radius: 5px; }
    </style>
</head>
<body>
    <h1>你好！我是xxx</h1>
    <p>欢迎来到我的个人主页</p>
    <a class="link-btn" href="https://steamcommunity.com/" target="_blank">我的 QQ 资料</a>
    <br>
    <a class="link-btn" href="#" style="background-color: #0088cc;">我的 WeChat</a>
</body>
</html>

保存并退出：

按键盘上的 Ctrl + O（保存），然后按回车确认文件名。

按键盘上的 Ctrl + X（退出编辑器）。

常用操作

Ctrl + O（保存）

Ctrl + X（退出编辑器）

Ctrl + K 的功能是“剪切当前行”

Alt + U 撤销

Ctrl + O（保存）

浏览器输入 http://你的公网IP地址 就可以进入网站

此外，如果需要使用VScode远程连接SSH服务器可以参考：VS Code 远程连接 SSH 服务器

但注意，前面选择的服务器【2核(vCPU) 2GiB | 经济型 e | ESSD Entry 40GiB】如果使用 VS Code Remote-SSH 拓展，本身的服务端进程（vscode-server）将占用近 1.2 GB 的物理内存，，VS Code 在后台尝试扫描、建立缓存、同步文件状态时，会瞬间吃满 2G 内存，会导致SSH 连接超时时间

因此，在实际使用VScode编辑网页文件时，建议在本地用 VS Code + Live Server 修改和预览网页，改完后提交到 GitHub，SSH 连上服务器仅用再用git pull拉取下来

在这里插入图片描述