使用 Coolify 部署 Webstudio 项目

Coolify 让将 Webstudio 项目部署到 Hetzner 变得既简单又强大。

在本指南中，您将学习如何设置项目、在 Hetzner 服务器上部署它，并保持对基础设施的完全控制，整个过程只需几个简单的步骤。

您需要准备的内容

在开始之前，请确保您拥有：

• 一个 GitHub 账户 用于托管您的代码。
• 一个 Hetzner 账户 用于配置您的服务器（或者任何其他托管服务提供商的账户）。
• 本地安装的 Webstudio CLI 用于管理项目导出。

1. 创建您的 GitHub 仓库

首先，在 GitHub 上 创建一个新的仓库，用于存储您的 Webstudio 项目代码。

仓库创建完成后，克隆该仓库 到您的本地机器，以便开始本地开发。

2. 导出您的 Webstudio 项目

使用 Webstudio CLI，导出您的项目并选择 “Docker” 选项。

这将使您的项目准备好通过 Coolify 进行部署，无需安装其他依赖项。

3. 将代码推送到 GitHub

在本地导出项目后，将代码推送到 您创建的 GitHub 仓库。这使得您的项目可以被部署访问。

4. 设置您的 Hetzner 服务器

按照以下步骤准备您的 Hetzner 服务器：

1. 创建新服务器： 登录 Hetzner Cloud 控制台 ↗ 并创建新服务器。

1. 选择区域： 选择最适合您需求的区域。

1. 选择 Ubuntu： 选择一个 Ubuntu 镜像（确保它是支持 Docker 的版本，查看 Docker Ubuntu 要求）。

1. 配置资源： 建议使用至少 2 GB 内存的共享 CPU。

1. 分配 IPv4 地址： 确保您的服务器拥有专用的 IPv4 地址。

1. 完成设置： 点击 创建并立即购买，并等待服务器配置完成。

2. 保存 IP 地址： 复制您服务器的 IPv4 地址，稍后会用到。

5. 将 Coolify 连接到您的服务器

1. 添加私钥： 登录到您的 Coolify 账户（如果您是新手，请先创建一个账户）并添加一个新的私钥。

2. 添加服务器： 导航到 服务器 选项卡，并通过输入您的 Hetzner 服务器的 IPv4 地址添加新服务器。

3. 验证服务器： 点击 验证服务器并安装 Docker 引擎。Coolify 将自动在您的服务器上安装所有必要的组件。

4. 检查状态： 完成后，您应该看到绿色的 代理正在运行 状态，表示一切设置完毕。

6. 在 Coolify 上配置您的项目

1. 创建新项目： 前往 项目 部分并创建新项目。

2. 添加资源： 添加新资源，选择您的 GitHub 仓库作为源。

3. 连接您的仓库： 使用 GitHub 应用集成授予对您的仓库的访问权限。

4. 选择构建包： 将构建包更改为 Dockerfile 并点击继续按钮。

5. 配置域名并部署： 在域名字段中输入您的域名，然后点击 部署，等待 Coolify 构建并部署您的项目。

6. 部署成功： 部署完成后，您将看到“部署已完成”的消息。

7. 访问您的网站： 使用项目仪表板顶部的 链接 按钮访问您的实时网站。

8. 可选 – 第三方域名： 如果您的项目从外部来源加载图像，请在环境变量 DOMAINS 下以逗号分隔列表的形式添加这些域名。（添加变量后请确保重启应用程序）

7. 更新您的 Webstudio 网站

要发布更新并保持您的网站最新，请按照以下步骤操作：

1. 发布更改： 在 Webstudio 构建器中，点击 发布 以生成最新的构建数据。
2. 同步和构建： 在终端中运行以下命令：

   webstudio sync
   webstudio build --template docker

3. 推送更新： 提交并推送您的更改到 GitHub。Coolify 将检测到更新并自动触发新的部署。

现在您已经准备好了！