随着 JAMstack 这一精彩世界的蓬勃发展,所有有助于其发展的服务和工具类别都比以往任何时候都更加重要。有 静态网站生成器、无头 CMS 和 静态文件托管。
我认为这些分类很方便,并有助于推动对话。但有时需要细致入微,而这些分类类别会变得有点模糊。
请注意,这些图表仅旨在描绘一个频谱,而不是提供服务的全面列表。
无头 CMS
无头 CMS 是一种 CMS,它提供一个管理区域用于创建和编辑内容,但没有前端来构建网站。所有内容都通过 API 访问。
想象一下 WordPress,它有一个管理区域,但它也有一些主题,你可以从中在服务器端构建网站,并可以使用各种 PHP 函数来使用内容数据。所有这些主题内容都是“头部”。因此,无头 CMS 就类似于只有管理区域的 WordPress。实际上,你可以这样使用它,因为它提供了 API。
这里还有更多的细微差别,因为有些服务提供管理区域,但实际上并没有为你存储数据。此外,还有一些 CMS 是为你托管的,还有一些 CMS 需要你自备托管。让我们来看一看。
服务 | 无头? | 托管 | 笔记 |
---|---|---|---|
Contentful | 是 | 云 | 一个经典的无头 CMS |
Sanity | JSON 数据结构,通过 API 访问,自定义管理区域是自托管的 | ||
Cockpit | 自身 | 带有管理 UI | |
Strapi | |||
KeystoneJS | 所有代码,甚至没有管理 UI | ||
WordPress | 有点 - 通常与头部一起使用 | 自身或 云 | 有头部,但你不必使用它,如果你愿意,可以选择仅使用 API 来访问内容。 |
Drupal | 自身 | ||
CraftCMS | 自身 | 专门具有无头模式和 GraphQL API。Craft Cloud 将带来云托管的无头版本 | |
NetlifyCMS | 有点 - 实际上并不存储内容,只是帮助编辑它。 | 用于 Git 托管 Markdown 的 GUI | |
Forestry | 云 | ||
Joomla | 否 | 自身 | 一个经典的有头 CMS |
Squarespace | 云 | 网站构建器,旨在构建托管/有头网站 | |
Wix |
静态网站托管
这很难谈论,因为从字面上讲,任何网络主机都会托管静态文件,并且可能做得还不错。我认为考虑专门进行静态托管的主机更有用,因为这意味着它们可以针对这种情况进行优化并执行其他有用的操作。
服务 | 笔记 |
---|---|
Netlify | 静态文件托管的黄金标准。开发人员便利设施应有尽有。 |
Cloudflare Workers 站点 | CDN 优先的静态文件托管以及云函数服务。 |
Firebase 托管 | Firebase 是一整套子产品,但特别是托管是静态的并且位于 CDN 上。 |
GitHub Pages | 静态文件主机,但也会运行 Jekyll和其他操作。不是 CDN。 |
Neocities | 带有在线编辑器和社区的静态文件主机。 |
S3 | 原始文件存储。可以配置为网络主机。除非您在它前面放置 CloudFront,否则它不是 CDN。 |
Bluehost | 并不是真正的静态文件主机。 |
MediaTemple | |
Hostgator |
有时你会看到人们试图使用 Dropbox 或 Google Drive 之类的东西来进行静态文件托管(用于网站),但我发现这些服务通常最终不喜欢这样做并阻止这种用途。如果今天可以工作,那就没问题,但我不会长期依赖任何一个。
静态网站生成器
您可能会认为此类别很简单,没有太多频谱。静态网站生成器获取输入并创建静态生成的页面,这些页面可以在没有例如需要访问数据库的情况下呈现。但即使在这里,也存在一个频谱。
生成器所使用的语言确实很重要。它会影响速度。它会影响在不同本地平台上的可安装性。它会影响您编写代码来扩展和修改它的能力。
但也许更重要的是,并非所有静态网站生成器都只是静态网站生成器。奇怪的是,有些也可以在服务器上运行。还有一些看起来像静态网站生成器,但更准确地归类为平面文件 CMS。
软件 | 语言 | 笔记 |
---|---|---|
Jekyll | Ruby | 这一代静态网站生成器中的原始版本之一。 |
Hugo | Go | 以速度著称。 |
11ty | Node | 开箱即用地处理 11 种不同的模板语言。 |
Gatsby | React | Gatsby 确实是一个静态网站生成器,但通常,网站“水化”成SPA,但仍然是静态的(没有任何服务器端渲染)。庞大的插件生态系统有助于连接数据源、处理图像等。 |
Next | Next 可以进行静态网站生成,但它也可以在 Node 中实时运行,并动态进行服务器端渲染(“同构 JavaScript”)。 | |
Nuxt | Vue | Nuxt 是 Next 在 Vue 中的精神伴侣。它也可以是静态生成器或以同构方式运行。 |
Kirby | PHP | Kirby 从静态文件运行(没有数据库),但实际上并不是静态网站,因为页面是由 PHP 渲染的。 |
Statamic | Statamic 类似于 Kirby,它使用静态文件作为数据,但页面本身是由 PHP 渲染的。 | |
Perch | 只是一个 CMS 的示例,它将数据保存在数据库中,并且根本没有尝试成为静态网站生成器。 |
嗨,Chris!感谢您将这些内容整合在一起。我认为 Cloud Cannon 将是此列表的一个很好的补充。它是一个基于云的 CMS,它连接到您的 Git 存储库,并在您保存帖子时进行提交。它仅适用于 Jekyll。他们也会为您托管您的网站。我们公司已经使用它 2 或 3 年了。这是一个很棒的工具,允许非开发人员通过一个不错的 GUI 编写博文……他们正在创建 Markdown 文件,他们甚至不知道。
您好,
没有关于 Prismic CMS 及其强大的 Slices 概念的任何说明 :(
如果您仍然愿意添加它,我相信它应该位于无头 CMS + 云 + 中。它特别之处在于:CMS 中的切片对应于代码中的宏组件(页眉、滑块、图片库)
完整披露:我在 Prismic 工作 ;) 如果您想尝试一下并了解更多信息,请与我联系!
还有 Gridsome,它是 Gatsby 在 Vue 中的精神伴侣。它仍在测试版阶段,但非常好。
另一个值得一提的云托管无头 CMS 是 Prismic(https://prismic.io/),我一直在将其用作 headless WordPress + Advanced Custom Fields 的替代方案。
感谢这个惊人的 JAMStack 频谱!
在这种情况下,对于 Hugo,我们应该区分代码库和开发人员实际上将编写的代码。
虽然 Hugo 是用 Go 编写的,但没有 Hugo 开发人员需要编写一行 Go 代码(甚至不可能)。它可能会改变,但目前Go 模板是即使是最高级的 Hugo 开发人员也唯一需要担心的语言。
一如既往的好文章!
我知道您可以永远填充这些表格。但是…
我真的很认为 Gridsome 应该出现在 SSG 表格中,就像 Nuxt 是 Next 在 Vue 中的版本一样,Gridsome 是 Gatsby 在 Vue 中的版本。
另外,我认为 Sanity.io 应该出现在 CMS 列表中 :D
感谢你的帖子!我最近几个星期一直在探索静态网站生成的世界。我想补充一下 GetPelican 和 Lektor。两者都是 Python 开发的,后者是一个静态 CMS。
还有 Hexo。100% 是网站生成器。类似于 Hugo
请注意文章中的这一行
这里有很多“那我的最爱呢”的讨论,我实际上很喜欢这一点,但如果文章囊括了阳光下的所有服务,它就会失去价值。
为此,欢迎您向 https://serverless.css-tricks.com 提交 Pull Requests
嗨,Chris!感谢这篇文章!
我是 Flextype CMS 的创始人兼首席开发者。
如果您能尝试并审查我的个人项目 http://flextype.org 将不胜感激。
使用 Flextype,您可以完全掌控。按照您想要的方式设计您的数据结构。使用版本控制更新和与他人及团队共享您的数据。Flextype 不需要 MySQL 数据库,因为所有数据都收集在简单的文件中。