用 4 个步骤构建一个 API 驱动的静态网站
用 4 个步骤构建一个 API 驱动的静态网站
原文：https://medium.com/hackernoon/build-a-static-website-in-4-steps-3f39b8d97ad3
卡森·吉本斯是 Cosmic JS 的联合创始人和 CMO，这是一个 API 第一的基于云的内容管理平台，它将内容与代码分离，允许开发人员用他们想要的任何编程语言构建流畅的应用程序和网站。
在这篇博客中，我将详细介绍如何用 4 个步骤构建一个 API 驱动的静态网站。静态网站将使用 Webhooks 和 Markdown，在内容通过 Cosmic JS 内容管理 API 动态更改后自动重建。虽然我只是从 Cosmic JS Apps 页面中挑选了一个内容就绪的静态网站，但是通过阅读如何构建一个 API 驱动的静态网站，你可以看到 API 驱动的静态网站是如何用 Node.js 构建的，特别是 Express 框架。
1.用宇宙 JS 创建一个新桶
注册参加 Cosmic JS 或导航至您的 Cosmic JS 仪表盘添加新的存储桶。添加新的存储桶后，系统会提示您创建存储桶的名称。这将分配将用于应用程序的 API 端点的 bucket slug。
我将我的桶命名为“卡森的静态”，作为这个博客的例子。
2.安装 COSMIC JS API 驱动的静态网站
一旦我保存了我的 bucket，我将可以选择安装一个应用程序或者直接创建我的对象类型。我正在从宇宙 JS 应用页面安装 API 驱动的静态网站。
一旦你选择了应用程序，你会在你的宇宙 JS 仪表板中看到应用程序页面。您可以在 Node.js、PHP、React 以及其他标签之间进行过滤，以在内容就绪网站和应用之间进行过滤。
我安装了静态网站,然后看到一个部署到 Web 模式。我喜欢在安装应用程序的那一刻部署它们，这样我就可以在宇宙 JS CMS 中编辑我的 web 应用程序，并在 API 立即更新我的应用程序时实时刷新以查看我的结果。
3.部署静态网站
一旦选择部署到 Web，您将可以选择设置环境变量以及添加托管功能，如自定义域和一键式 SSL 。
点击 Deploy to Web，会出现一个“Deploy Web App”模式，澄清我的 GitHub 分支、部署位置等等。
开始倒计时，直到你的静态网站上线，但不要让它阻止你编辑全局、页面、内容、媒体或任何你想要的东西:)
在宇宙 JS 上的平均部署需要 2 分钟。我收到一封电子邮件，里面有我静态网站的实时链接。
4.管理动态内容和审查
自然地，我点击查看我的静态网站，它在http://carsons-static.cosmicapp.co直播。
静态 HTML 和 Markdown 相结合的快速体验。宇宙 JS API 为 API 驱动的静态网站提供动态内容，通过宇宙 JS 内容管理平台控制。
编辑对象，添加新媒体和发布内容到您的静态网站。静态网站在页面加载时会随着内容的变化而自动重建，因此您可以实时地维护静态网站。
部署成功后一分钟，我使用了谷歌的开发者页面速度洞察,我的静态网站已经启动了 zippy HTML，加上静态网站的降价文件，实现了快速加载体验。
点击此处查看 GitHub 上的静态网站代码库。
查看宇宙 JS 上的静态网站 App 页面。
Cosmic JS 是一个 API 第一的基于云的内容管理平台，使得管理应用和内容变得容易。如果你有关于 Cosmic JS API 的问题，请通过 Twitter 或 Slack 联系我们。
