跳到主要内容
TODO

Deno 上 Web 框架的现状

最近,我们宣布在 Deno Deploy 上支持 npm: 标识符。这使得 Deploy 成为第一个构建于 isolates 之上的边缘 JavaScript 运行时,以支持 npm 上超过 200 万个模块。虽然 Deno 的设计初衷并非作为 Node.js 的直接替代品,但我们为提供与为 Node 设计的模块的向后兼容性而进行的持续工作,已经解锁了使用 Deno 构建 Web 应用程序的新方法。

不要只听我们说 - 今天在 Deno Deploy 上,您可以使用我们现成的模板之一来使用从 SvelteKitDocusaurus 的框架。

new project flow on Deploy

为了帮助您入门,我们准备了一个关于 Deno 中 Web 框架状态的旋风之旅。以下是我们将涵盖内容的概述 - 点击框架名称即可跳转到相应部分,并探索接下来您可以在 Deno 中构建什么。

🦕 Deno 原生    ⬢ Node.js 原生

静态站点

  • 🦕 Vanilla JS 或 SPA Vanilla JavaScript 应用程序或旨在纯客户端运行的单页应用程序 (SPA) 框架(React、Angular、Vue.js 等)可以与 Deno 驱动的 API 服务器一起使用。
  • 🦕 Lume Deno 原生的静态站点生成器。
  • Docusaurus 针对文档的网站的 SSG。
  • Gatsby 可扩展的 SSG,“Jamstack” 的先驱。
  • Next.js(静态导出) React Web 框架,在 Deploy 上以 SSG 模式工作。

动态 Web 应用

  • 🦕 Fresh Deno 原生的 Web 应用程序框架,具有服务器渲染和交互式客户端岛屿。
  • 🦕 Hono 类似于 ExpressSinatra 的轻量级动态 Web 框架。
  • 🦕 Oak Koa 启发的 Deno 原生中间件框架。
  • Astro 适用于以内容为中心的站点的混合 SSR 和 SSG 框架。
  • SvelteKit Svelte 驱动的 SSR 和 SSG Web 框架。
  • Nuxt Vue.js 驱动的 SSR 和 SSG Web 框架。
  • Remix 具有服务器渲染和客户端水合的动态 Web 应用程序。
  • Qwik 围绕可恢复性构建的 SSR 和 SSG Web 框架。

Deno 上的静态站点

在一段时间内,在 Deno Deploy 上托管纯静态站点已经成为可能。使用像 Hono 这样的应用服务器或 Deno 标准库中的静态文件服务器,您可以非常愉快地从 Deploy 提供静态文件。

以下是今天 Deno 上支持的一些流行的静态站点开发选项。

Vanilla JS 或单页应用程序 (SPA) 框架

如果您的应用程序不需要使用框架(可能不需要),您可以使用基于 Deno 的 静态文件服务器或像 Hono 这样的应用程序服务器来提供未经处理的 HTML、CSS 和 JavaScript,并根据需要合并后端 API 路由。

对于为长时间使用会话和复杂前端交互设计的 Web 应用程序,单页应用程序 (SPA) 架构可能是正确的选择。您将通过 Deno 提供静态资源,但您将开发更多客户端代码,这些代码使用诸如 ReactAngularVue.js 等前端框架。

根据您选择的框架,在您的代码可以在浏览器中运行之前,可能需要编译或预处理步骤。其中一些构建过程可以在 Deno 中运行,但有些可能仍然需要使用 Node.js。

以下是一些您今天可以使用 Deno 和 Deno Deploy 尝试的 SPA 开发模板

Lume

Lume 是为 Deno 设计的静态站点生成器。它允许您以 markdown、JSX 或您认为合适的任何格式编写网页,并根据需要生成静态 HTML、CSS 和 JavaScript。因为它专为 Deno 编写,所以构建速度特别快,并且只需安装最少的依赖项。它支持各种内容类型,并且可以扩展以与其他类型一起使用。

Docusaurus

Docusaurus 是一个针对技术文档优化的静态站点生成器。由于它支持版本控制、国际化以及许多文档站点所需的内容功能,因此已被许多开源和商业项目采用。事实上,Deno 最近将 我们自己的大部分文档迁移到了一个由 Hono 和 Docusaurus 驱动的站点

为了获得最佳的开发者体验,我们建议今天将 Docusaurus 与 Node.js 和 npm 兼容的包管理器一起使用。您可以使用 npm 脚本构建站点,然后通过 Deno 静态文件服务器应用程序服务器部署和提供它。

此配置允许您利用 Docusaurus 周围的工具和生态系统,但仍然可以获得使用 Deno 处理文档站点可能需要的任何动态代码的好处。

Gatsby

Gatsby 是一个静态站点生成器,也是 “Jamstack” 架构的早期先驱,该架构倾向于从构建时获取的数据生成静态站点。这个基于 React 的静态站点生成器仍然是构建位于无头 CMS 中的数据之上或跨越许多不同数据源的静态站点的绝佳选择。您可以通过 Deno 静态文件服务器应用程序服务器来提供从 Gatsby 构建过程导出的静态资源。

Next.js

Next.js 是一个基于 React 的 Web 框架,它混合使用静态站点生成和动态渲染来提供网站。在撰写本文时,Deno 或 Deno Deploy 尚不支持许多 Next.js 动态渲染功能。

但是,如果您使用 Next.js 生成静态站点,则这种使用模式与 Deno 和 Deno Deploy 完全兼容。您可以通过 Deno 静态文件服务器应用程序服务器来提供从 Next.js 构建过程导出的静态资源。

动态 Web 应用程序框架

当您开始构建动态 Web 应用程序时,Deno Deploy 真正大放异彩。我们全球网络上的最短冷启动时间和低延迟使 Deploy 成为构建任何类型数据驱动型 Web 应用程序的绝佳选择。

以下是一些今天可以在 Deno Deploy 上运行的动态 Web 框架。

Fresh

Fresh 是一个为 Deno 设计的 Web 框架,它具有边缘的动态渲染、客户端的交互式岛屿以及默认情况下无需构建步骤的超快速部署。凭借类似于 Next.js、SvelteKit 或 Nuxt 等框架的功能集,我们建议您查看它,以了解您可能想在 Deno 上尝试的任何新项目。

如果您正在构建 SaaS 应用程序,您可能还想查看 SaaSKit,这是一个 Fresh 应用程序,它已经实现了身份验证、支付以及新 SaaS 项目所需的许多其他功能。

Hono

Hono 是一个类似于 ExpressSinatra 的轻量级 Web 应用程序框架。只需几行代码,您就可以设置 API 服务器或动态网页服务器。Hono 提供了 Deno 原生的安装路径,并且与 Deno 内置的 TypeScript 工具配合良好。

Oak

Oak 是一个受 Koa 启发的 Deno 原生中间件框架。它提供了一种强大而灵活的方式来在 Deno 中编写 API 服务器,并且在 Deno Deploy 上运行良好。

Astro

Astro 是一个为以内容为中心的网站设计的 Web 框架。它能够在多种运行时环境中进行服务器端渲染,包括 Deno Deploy。除了Astro 组件和页面之外,您还可以使用您最喜欢的客户端框架在前端构建交互式岛屿。

Astro 在许多不同的环境中使用 适配器在生产环境中运行,其中 Deno Deploy 就是其中之一。在本地开发期间,我们建议使用 npm 来管理依赖项和运行管理脚本,因为 Astro 是围绕这些工作流程设计的。但是,您仍然可以在 Deno 运行时上运行您的代码,这使您可以访问零配置 TypeScript 和内置 API(如 Deno KV)。

如果您想将 Astro 和 Deno 一起使用,我们强烈建议从这个模板开始,该模板已预先配置了 Deno SSR 适配器和本地开发脚本。

SvelteKit

SvelteKit 是一个全栈 Web 框架,它支持由 Svelte 驱动的服务器渲染和客户端交互性的混合。SvelteKit 应用程序需要在生产环境中运行之前进行构建步骤,并且可以使用此适配器在各种 JavaScript 环境(包括 Deno Deploy)中工作。

与围绕 npm 设计的其他框架一样,我们建议使用 npm 进行本地开发和依赖项管理。但是,您可以使用 Deno 运行 Svelte 开发服务器,从而利用 Deno 运行时功能。

Nuxt

Nuxt 是一个支持客户端和服务器渲染的 Web 框架,它围绕 Vue.js 构建。Nuxt 应用程序使用 Nitro 应用服务器进行部署,并使用 Deno 预设

与此列表中的其他以 Node 为中心的框架一样,我们建议使用 npm 来管理依赖项和运行本地开发脚本。但是,使用 Nitro 的Deno 预设意味着您的 Nuxt 在 Deno Deploy 上运行良好。

Remix

Remix 是一个基于 React 构建的全栈 Web 应用程序框架。它可以运行在各种 JavaScript 环境中,包括 Deno 和 Deno Deploy。

您的 Remix 项目可以配置为使用 deno 服务器构建目标输出生产版本。然后,生成的项目可以在 Deno Deploy 上运行。

Qwik

Qwik 是一个用于创建动态 Web 应用程序的新框架,该框架是“可恢复的”。它延迟了浏览器中的 JavaScript 执行,以保持应用程序的快速运行。

Qwik 通过一个中间件组件支持 Deno Deploy,该组件利用了 Deno.serve 使用的 Web 标准 RequestResponse 对象。

立即在 Deno Deploy 上试用新的框架!

准备好停止阅读并开始编程了吗?查看我们最近改进的新项目体验,并在现成的模板中试用这些框架之一。

与往常一样,我们很乐意听到您正在构建什么!在以前称为 Twitter 的网站我们的 DiscordYouTube 上联系我们。我们很高兴听到您今天正在使用哪些框架。