5 个版本

0.0.6	2023 年 8 月 1 日
0.0.5	2023 年 8 月 1 日
0.0.4	2023 年 8 月 1 日
0.0.3	2023 年 7 月 19 日
0.0.2	2023 年 7 月 18 日

在 Rust 模式中排名第 620

每月下载量 27

MIT 许可证

170KB
477 行（不包括注释）

Hyperide

由 hypermedia 和 oxyhydroxide 缩写而成。

此库提供工具，帮助在 hyperide 栈中开发。

Hyperide 栈包含

后端提供者，您可以选择 axum（服务器）或 vercel（无服务器）
数据库提供者，您可以选择 planetscale（mysql）或 turso（sqlite）
Rust 中的 HTML（通过 hyperide! 宏）
HTML 中的样式（tailwind）
HTML 中的超媒体请求（htmx）
HTML 中的脚本交互（hyperscript）

通过结合这些技术，您可以从 Rust 中完全开发全栈超媒体应用程序。

后端

该栈建议使用 Axum 可选，并为后端使用 Vercel。

Axum

您可以通过查看其文档来学习如何使用 Axum。使用 hyperide! 来构建您的 HTML 响应。

async fn greet(Path((name,)): Path<(String,)>) -> Html<String> {
    Html(hyperide! {
        <p>{"Hello, "}<strong>{name}</strong>{"!"}</p>
    })
}

Vercel

要使用 vercel，您需要创建和修改以下文件

/vercel.json

{
  "rewrites": [{ "source": "/:path(.*)", "destination": "/api/main" }],
  "functions": {
    "api/main.rs": {
      "runtime": "[email protected]"
    }
  }
}

/.vercelignore

target/

/Cargo.toml

# add this section
[[bin]]
name = "main"
path = "api/main.rs"

/api/main.rs

use axum::{extract::Path, routing::get, Router};
use vercel_runtime::Error;

#[tokio::main]
async fn main() -> Result<(), Error> {
    let app = todo!("Put your axum router here");
    hyperide::vercel::run(app).await
}

数据库

该栈建议在 Planetscale 和 Turso 之间选择数据库后端，因为两者都可以在无服务器环境中运行。或者，使用 SQLx 和您喜欢的数据库。

Rust 中的 HTML

用于在 Rust 中生成 HTML 的宏。将其视为类似于 leptos、yew 或其他提供 Rust 中 HTML 的 crate，但功能减少了 99%。您可以用类似 HTML 的语法编写，并返回一个 String。

hyperide! {
   <!DOCTYPE html>
   <html lang="en">
   <head>
       <meta charset="utf-8" />
   </head>
   <body>
       <h1>{"Hello, world!"}</h1>
       <{returns_tag()}>This is in a closed paragraph.</_>
       <!-- "wildcard close tag ⬆️" -->
       {my_component("Foo", "bar")}
   </body>
   </html>
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <h1>Hello, world!</h1>
    <p>This is in a closed paragraph.</p>
    <!-- "wildcard close tag ⬆️" -->
    <p><strong>Foo: </strong>bar</p>
  </body>
</html>

HTML 中的样式

建议您在构建步骤中将 tailwind 设置为构建步骤的一部分。您需要安装 tailwind cli。脚本将尝试默认使用 tailwind 作为二进制文件，但您可以使用 TAILWIND_BIN 环境变量来覆盖此设置。

/tailwind.config.js

module.exports = {
  content: ["./src/**/*.rs", "./api/**/*.rs"],
  plugins: [],
};

/tailwind.in.css

@tailwind base;
@tailwind components;
@tailwind utilities;

/build.rs

use std::path::Path;

fn main() {
    hyperide::tailwind::bootstrap(
        Path::new("./tailwind.config.js"),
        Path::new("./tailwind.in.css"),
    );
}

在响应的 <head> 中使用 include_tailwind! 宏来包含 tailwind 生成的样式表。

HTML 中的超媒体请求

我建议您阅读《超媒体系统书籍》和《htmx文档》。使用hyperide::htmx::include_htmx!将其添加到您响应的<head>中。

HTML 中的脚本交互（hyperscript）

要添加使用hyperscript的简单内联脚本支持。使用hyperide::hyperscript::include_hyperscript!将其添加到您响应的<head>中。

VSCode语法高亮

这正是您想要的

https://marketplace.visualstudio.com/items?itemName=brvnonascimento.code-html-macro-server

依赖项

~19–31MB
~554K SLoC