使用去中心化存储构建网站

今天的大多数网站都遵循后端服务器到前端代码的架构。但在 Web3 应用程序中，前端代码不具有与受智能合约保护的后端代码相同的去中心化性和弹性。那么如何使网站像智能合约一样具有弹性呢？

该体系结构似乎很简单：

1. 创建一个没有服务器的静态网站。
2. 在去中心化的存储空间托管代码。
3. 将“入口”放在一个地方，指向去中心化的地址。

为此，我们不得不进入去中心化存储的“兔子洞”。了解这些不同的解决方案可以帮助我们创建最去中心化的网站。

你可以在此处查看我们将要引用的所有代码。

1. 制作静态网站

由于我们试图开发“不可阻挡”的网站，我们需要确保我们没有单点故障的风险。如果我们的网站需要对中央控制的服务器进行 HTTPS 调用，我们就创建了一个故障点。

所以我们需要创建一个静态站点，其中的 HTML、Javascript 和 CSS 文件都是从去中心化的存储位置提取的，我们没有任何 Javascript 或服务器语言运行代码来帮助支持该站点。

对于熟悉 Web 开发的人来说，这是一项非常简单的任务。你可以创建一个包含 HTML、JS 和 CSS 的页面。然后你就完成了。还有更高级的框架可以帮助你做到这一点，例如 Gatsby、Hugo 和 Eleventy。

我们使用 NextJS 的静态导出功能来做展示页面，当然你也可以使用 React 或功能更强大的框架来做到这一点。我们创建了这个演示站点，它只是展示这只青蛙的图片，并且有一个指向 Discord 通过 32 小时的 FreeCodeCamp Javascript & Solidity 课程帮助开发者学习。

如果我们愿意，我们仍然可以让我们的网站与像以太坊这样的区块链作为后端进行交互，因为去中心化的后端不会再多增加一层中心化。

现在我们有了网站，接下来我们必须弄清楚在哪里托管它。

2. 托管站点：尝试使用 ETH

作为一名 Web3 开发者，我的第一个想法是：为什么不是以太坊？

现在，我们可以将所有数据存储在以太坊或其他 EVM 链上。但无论我们怎么做，它的代价都太过高昂。

与其尝试将我们的文件夹复制粘贴到合约中的存储变量中，更聪明的方法是将整个站点进行 base64 编码，将其编码为一个巨大的 URI，我们可以将其存储在一个或多个存储变量中。

我摆弄了几个小时，试图让这种方式在费用方面不那么夸张，然后我放弃了。即使在 Arbitrum 上，存储所有这些数据看起来也至少要花费 200 美元。但是，对于较小的站点，这将是一种可行的方法。

因此，我创建了一个质量