如何使用 Google Drive 在 3 分钟内免费部署静态网站

了解如何使用 Fast.io 在 3 分钟内免费部署静态网站。本指南还提供了使用 Google Drive 等云存储的新手指南。

免责声明

在本文中，我将与您分享一项名为 Fast.io 的新服务。

我写这篇文章并非受他们赞助。我写这篇文章只是因为我发现这个免费托管静态网站的解决方案很有趣也很实用。

什么是 Fast.io

Fast.io 是由 Mediafire 打造的一款简化网络体验的解决方案。简而言之，他们的目标是通过提升网络的可访问性和可管理性，让你的生活更加轻松。

如果今天我与你们分享这个网站，那是因为他们在 2019 年底推出了它。

工作原理

通过此解决方案，您只需单击几下即可连接到您的云（Google Drive、DropBox 等）、选择网站名称并部署您的内容。

如果您的内容已准备好，只需 3 分钟即可将您的内容发布到网上并供所有人访问。

一旦您的网站上线，您就可以对其进行配置，添加自定义域名，并连接 Google Analytics 以了解您覆盖了多少人。

我之前没告诉你，但这项服务会在你修改源文件后自动更新你的网站。例如，如果你使用 Google Drive 分享内容，那么一旦你修改了 HTML 页面，它就会自动更新。Fast.io
-工作原理

可用的存储提供商

在我发布文章的当天，我会给你一份可用的存储提供商列表：

GitHub
Dropbox
Google 云端硬盘
盒子
媒体火
OneDrive

我们可以想象，随着新服务的出现，这份清单还会越来越长。我想向你展示的是，托管静态网站的方式多种多样。

竞争对手

有很多公司都在开发快速上线静态网站的解决方案。其中最著名的是 GitHub Pages、Heroku 和 Netlify。

我并不是说 Fast.io 是最好的，但我喜欢它部署简单网站的简单性。

如果您想部署更复杂的东西，比如 Python Flask 网站，那么您无法使用 Fast.io 来实现。

在这种情况下，我强烈建议使用 Heroku。

正如我所说，我对你很坦诚。对于某些任务来说，这是一个很好的服务。

什么是静态网站

在向您展示如何部署您的网站之前，我认为有必要定义什么是静态网站以及它与动态网站有什么区别。

静态网站包含内容固定的网页。页面内容以 HTML 格式呈现，所有用户看到的都是相同的内容。

例如，当您想为您的网站制作一个登录页面（包含有关您的产品信息的基本页面）时，您可以使用这种网站类型。

与动态网站的主要区别显然是......动态部分！

动态网站在用户请求网站时使用服务器技术来构建页面。

例如，您可以将此网站类型用于您的博客。每次您要在数据库中添加新文章时，网站都会显示它。

是时候部署你的网站了

准备好和大家分享你的页面了吗？快来分享吧！

在本部分中，我将向您展示如何通过几次点击将您的网站上线。我将使用一个基本的 HTML 页面，但一旦您了解了 Fast.io 的工作原理，您就可以自由地修改所有内容。

如果您有任何疑问或想获取最新更新并关注我的活动，请随时在 Twitter 上给我发送消息。

1）创建index.html文件

您需要创建一个 index.html 文件，其中包含您的 HTML 代码。建议您从简单的开始，因为您可以稍后更新它。

将文件保存在您的计算机上。

<!DOCTYPE html>
<html>
  <head>
    <title>My Static Website</title>
  </head>
  <body>
    <h1>My Static Website</h1>
    <p>
      Hello, I'm online, and everyone can see me!
    </p>
  </body>
</html>

Index.html 示例

2）打开Fast.io主页

Fast.io主页

您只需打开 Fast.io 网站即可开始使用。完成后，点击“立即注册 - 免费！”。

3）配置Google云端硬盘

Fast.io - 存储提供商

步骤2之后会出现此页面，您可以选择存储提供商。选择“Google Drive”。

如果您想与其他提供商合作创建网站，您可以稍后通过您的帐户页面添加他们。Fast.io
- 连接 Google Drive

Fast.io 需要访问您的 Google Drive 帐户才能运行。他们将创建一个“Fast.io”文件夹来包含您的网站。点击“立即连接 Google Drive”。Fast.io
- 选择您的 Google 帐户

您需要选择您的 Google 帐户并将其与 Fast.io 关联
。Fast.io - 允许 Fast.io 访问 Google Drive

您需要允许 Fast.io 访问您的 Google 帐户才能正确关联。Fast.io
- 创建您的帐户

您的帐户已准备就绪，请选择密码，然后点击“创建帐户”。Fast.io
- 欢迎页面

帐户准备就绪后，将出现“欢迎使用 Fast！”页面。点击“开始吧！”。

4）创建您的网站

Fast.io-仪表板

您已准备好创建您的网站并与大家分享！点击“添加新网站”。Fast.io
- 选择网站名称

选择您的网站名称并在输入框中输入。完成后，点击“下一步”。Fast.io
- 选择网站类型

Fast.io 允许您创建三种网站类型：文件共享网站、网页或文件浏览器网站。

在我们的例子中，我们将选择“网页”，因为我们想要托管一个 HTML 网页。

如果您稍后想要创建一个网站来共享一些文档，则必须返回仪表板，创建一个新的网站，然后选择“文件下载”。Fast.io
- 为您的网站选择存储提供商

点击“网页”后，您需要选择存储提供商。点击“Google Drive”。Fast.io
- 选择您的网站网址

选择您的网站网址并将其输入到输入框中。完成后，点击“创建网站”。Fast.io
- 网站创建成功

成功了！您的网站已上线，您可以通过您选择的网址访问。我的网站地址是mygoogledrivewebsite.imfast.io ，您可以访问我的网站。

5）上传你的index.html

如果您打开您的网站，您可能会注意到一个错误，因为您没有将您的 index.html 文件上传到您的 Google Drive。

有两种方法可以实现：

打开您的 Google Drive 并搜索 Fast.io 文件夹，然后搜索您的网站文件夹（在我的情况下为“mygoogledrivewebsite.imfast.io”）。
在第4步成功页面上，点击“查看您的Google Drive”。

Fast.io - 上传前的 Google Drive

完成后，右键点击鼠标，选择“上传文件”。新窗口会打开，找到你的“index.html”文件，然后选择它。
上传后，Fast.io - Google Drive

稍等片刻，更改就会出现在您的网站上。

6）庆祝！

Fast.io - 网站演示

快来告诉你所有的朋友吧！你的网站独一无二，所有人都能看到！

🎉请点击此处在 Twitter 上分享！ 🎉

7）奖金

如果您好奇并想配置所有内容，您可以返回仪表板并单击您的网站。

您将能够将您的网站链接到 Google Analytics（访客统计），更改您的网站域名（例如，mywebsite.com），以及更多！
ttps://herewecode.io/）。

如果您想要更多类似的内容，您可以在 Twitter 上关注我，我会在那里发布有关 Web 开发、自我提升以及我作为全栈开发人员的历程的推文！

文章来源：https://dev.to/herewecode/how-to-deploy-a-static-website-for-free-in-only-3-minutes-with-google-drive-254c