Quinoa--一个可以轻松创建现代UI的Quarkus扩展
藜麦......说实话，我一开始并不是很喜欢，但后来我妻子把它们做成了碗状，就像用牛油果和生鲑鱼做的沙拉。现在我真的很喜欢加点酱油。我们不要离题太远，我在这里不是要谈论健康的食物，这是关于用Quarkus享受编码现代用户界面的扩展。
| 这个扩展不是Quarkus的核心扩展，它可以作为Quarkiverse的一部分。我们需要早期的反馈和贡献来成熟这个想法。 |
开始吧
创建一个新的Quinoa项目（有一个基本的Quinoa启动代码）。：
quarkus create app quinoa-app -x=io.quarkiverse.quinoa:quarkus-quinoa
然后开始实时编码并导航到http://0.0.0.0:8080/quinoa.html。
quarkus dev
这里是Quinoa指南，可以深入了解并配置你的应用程序与任何基于Node的Web UI框架，如React，Angular，Lit，Webpack，Rollup，...
一点背景
除了Quarkus，与React和Angular等Web框架的互动也是一种自然需求。从Quarkus的早期阶段（#588）开始，许多用户就一直要求进行平滑的整合。这就是为什么我为Quarkus创建了Quinoa扩展。
自从Quarkus创建以来（3年前），已经有很多博客文章冒出来帮助这个问题，其中大部分都是利用frontend-maven-plugin。作为code.quarkus.io的创建者，我也遇到过这种情况，我和其他许多人一样，用这个插件填补了这个空白。它的工作是肯定的，并且已经足够满足目前的需要。不幸的是，整个过程可以更精简，更容易上手，它涉及大量的配置，一些棘手的设置，将资源复制到正确的地方，并在正确的时刻测试前端。现场编码需要启动两个进程和一个代理来使其一起工作。
让我们开始烹饪
有了这些经验，我就可以为缓解我们的生活做出一些贡献了。我注意到所有的需求、问题、建议和博客文章，并想出了一个新的扩展，用Quarkus创建健康的现代用户界面（UI）：Quinoa（代表Quarkus UI，没有hAssle:）。
Quinoa负责隐藏所有围绕Web UI构建/布线/实时配置的任务，让你负责你的Web应用逻辑。无论你是创建一个全栈式的单页应用还是微服务（微前端），事情都会变得更简单。
Node.js有很好的工具来创建现代前端Web应用。Quarkus有一个广泛的生态系统，可以在云中建立可靠的现代后端（微服务、休息、数据库、事件、云原生...）。Quinoa是获得两个世界最好的胶水。
NodeJS项目与Quinoa兼容的唯一先决条件是要有一个build 脚本。它应该在特定的目录下产生静态文件（index.html，javascript，css，...）。由于团队可以是不同的，为了让每个人都满意，可以把Web UI放在Quarkus项目中（默认是src/main/webui ），也可以放在外面（只要它在构建时在磁盘上可用）。
没有必要（但可以）配置软件包管理器（NPM、Yarn或PNPM），它将根据项目的锁定文件自动检测出来。
Quinoa将负责生成UI静态文件。在Quarkus构建过程中，它们将被捆绑在jar或本地二进制文件中。在运行时，它们将像Quarkus中的其他静态资源一样被有效地提供。UI开发者还要求启用单页应用程序的路由，现在它只是一个布尔配置。
现在，实时编码呢？这是Quarkus的一个流行功能，大多数NodeJS UI框架已经有这样的模式。Quinoa提供了两个选项。
-
委托给UI实时编码服务器。你配置UI服务器的端口。按照惯例，Quinoa将调用package.json中的
start脚本来启动UI服务器进程。然后它将透明地代理相关请求到给定的端口。 -
Quarkus观察文件，Quinoa会在变化时触发新的Web UI构建（你可以为开发和prod配置不同的构建）。
无论哪种方式，当启动Quarkus的开发模式时，你的Web UI将被无缝地提供（默认在http://0.0.0.0:8080）。这两种方式都是可行的，并且允许你同时在后台和前台进行实时编码，几乎不需要任何设置。很棒吧？
文档
quarkiverse.github.io/quarkiverse…
