web app - 更新文本文件的静态网站

Question

我正在使用 CSS、JS、HTML 创建一个简单的购物清单网站，以便我和我的朋友可以使用它。我将免费将它托管到 GitHub。GitHub 的问题在于它只能托管静态网站。因此，如果我更新我的列表，它只会在我的设备中更新，而不是在我朋友的设备中。我在网上看过一些教程，它们使用服务器、数据库和动态内容。所以我的问题是，有没有什么方法可以在不使用动态站点的情况下将列表保存到 Github 存储库中的文本文件中。并且从这个文本文件中，每当我更新、删除、刷新页面时，JS 都可以再次获取列表。或者这样做会使其成为一个动态网站？我想要一个静态网站并为所有访问该网站的人更新购物清单。谢谢您的回答。我是 HTML、CSS、JS 的新手，我知道我在这里遗漏了一些东西。

Answer 1

我不知道任何涉及 Github 的好的解决方案，但我认为你最好使用类似Firebase Firestore的东西。它基本上是一个 nosql（类 JSON）数据库，您可以直接从客户端（javascript）访问它。您还可以获得 1 GiB 的免费数据，这对于您的用例来说绰绰有余。它们提供了一个易于使用的界面，因此您可以非常快速地保存和获取数据，这有点像在云中保存 JSON。希望这有助于解决您的问题。

Answer 2

通常，正如您现在必须猜到的那样，GitHub 非常适合静态页面，如果您必须制作动态页面，您可能必须启动服务器和数据库。

不过，有几种方法可以解决这个问题，首先，您可以在http://000webhost.com等免费服务器上的某处托管 JSON 文件，然后使用 javascript 获取 JSON 文件并在屏幕上转储一些内容。数据。当然，您会注意到创建一个简单的 API 来将您的杂货数据存储在其他地方需要额外的工作。如果您不想使用 000webhost，还有其他选择，只需使用关键字“免费托管”，您就会在 google 上看到很多可供选择的选项。

另一种方法是使用 Web 存储，我说的是创建一个类似 javascript JSON 的对象作为您的数据并将其存储在本地存储中，这完全取决于您将来要扩展多少，您可能会冒着填满浏览器存储磁盘的风险，它可以走多远。然后你可以简单地用 JS 从存储中获取并显示在屏幕上。

另一种方法是通过手动硬编码代码库中的所有内容来完全静态化。

总之，说到静态站点生成器，还有很多其他的替代方案可能会让您大吃一惊，看看我用来快速展示静态页面原型的这个。- https://surge.sh

我希望这能让你知道现在该做什么？探索！

Answer 3

因此，您可以使用作为 JSON 文件的浏览器存储的缓存文件来执行此操作（这对您来说也是很好的做法） - 请记住，信息流只是一种方式，即您将要更新 JSON chrome中的文件，他们将下载这个并将传递数据） -

您要查看的文档是浏览器本地存储中的文档：

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

我希望这有帮助

谢谢 - W