Rakkas,快如闪电的Next.js替代品由Vite提供支持,刚刚发布了 0.4.0 版。

如果您不熟悉 Vite,它是一类新工具的实例,有时称为 non-bundlers,它利用现代浏览器的原生 EcmaScript 模块支持在开发过程中取消捆绑 .这导致即时服务器启动和更快的更新比传统的打包程序,如Webpack、Rollup或Parcel。这些新工具(另一个例子是Snowpack)极大地改善了开发人员的体验,一旦你尝试了,你就再也不想回到你的旧工具了。

Vite(以及因此 Rakkas)支持 TypeScript、JSX、热模块替换 React 快速刷新、CSS 模块、PostCSS、** CSS 预处理器**(只需安装sass、less或stylus)和开箱即用的静态资产处理。

Rakkas 是 MIT 许可的React框架_类似于_ Next.js,它不是克隆。事实上,如果你熟悉Svelte- 一个用户界面框架(如 React 或 Vue) - Rakkas 的许多功能都受到 Svelte 的 Web 应用程序构建工具SvelteKit的启发。

Rakkas的重要特点是:

• ⚡ 闪电般的快速开发服务器

• 📁 基于文件系统的直观路由

• 🖥️ 无忧的服务器端渲染

• 📄 静态站点生成(新!)

• ☸️ SPA 风格客户端导航

• ⬇️ 简单但有效的数据获取系统

• ⚙️ API 路由用于构建和组织您的后端

• 📚 广泛的文档

文件系统路由器将您的源文件映射到网页。例如,如果你想要一个页面/about,你只需从src/pages/about.page.jsx或src/pages/about/page.jsx默认导出一个 React 组件。路由参数也编码在文件名中:src/pages/users/[userName].page.jsx为/users/jane、/users/joe等呈现。在这种情况下,您的组件会收到params属性,并且用户名可用作params.userName。

Rakkas 支持嵌套布局用于多个页面共有的元素,如页眉、页脚、导航栏等。每个页面或布局都可以使用同构fetch函数获取自己的数据。对于高级用例,您可以实现自己的数据获取助手函数或类。服务器和客户端的实现可以不同,从而在进行 SSR 时可以避免网络往返和序列化/反序列化。

API 路由有一个类似于页面的文件系统路由器:/src/api/users.endpoint.js实现端点/api/users。从此文件导出的函数通过获取请求对象并返回一个类似名称的 HTTP 方法(即GET的get、POST的post等)来处理响应对象。您还可以定义中间件来实现与多个端点相关的抽象。

如果您在基于 Chromium 的桌面浏览器上阅读本文,您可以在 StackBlitz上在线试用 Rakkas。为了获得全面的体验,Rakkas 项目生成器create-rakkas-app具有许多功能,所有功能都是可选的:TypeScript、ESLint、StyleLint、Prettier、Cypress、和 jest(用于单元测试和/或 API 测试)。除了npm,它还支持yarn和pnpm。要开始使用,只需新建一个项目目录并运行npx create-rakkas-app@latest,然后按照提示操作即可。可选的演示应用程序演示了一个玩具全栈待办事项应用程序,该应用程序通过简单的 REST API 进行通信。

如果您想更进一步,还有与其他流行工具的集成示例:

• 样式组件

• 顺风 CSS

• MDX

• Apollo GraphQL(客户端和服务器)

还有一个RealWorld 端口(Rakkas 实现RealWorld 规范),一个简单但完整的全栈应用程序,演示如何构建 REST API,访问您的数据库(通过Prisma),处理身份验证,测试等等。

Rakkas 还很年轻,还没有准备好投入生产。但是继续尝试并分享您的想法。在 Github 上给我们加注星标和谈论 Rakkas如果你喜欢你所看到的。如果您有任何疑问、问题或建议打开 Github 问题。如果您想贡献,请分叉并发送拉取请求。 欢迎所有反馈,正面或负面。