写点什么

全栈 TypeScript CRUD 框架 Remult

  • 2023-06-05
    北京
  • 本文字数:1306 字

    阅读完需:约 4 分钟

全栈TypeScript CRUD框架 Remult

Remult 是一个全栈 CRUD 库,它利用 TypeScript 模型来简化开发,并提供了类型安全的 API 客户端和查询构建器。

 

在软件开发中,为了确保系统功能正常,必须管理和同步两个数据模型:服务器模型和客户端模型。服务器模型指定数据库结构和 API,而客户端模型定义 API 的传入传出数据。

 

然而,维护单独的模型集和验证器可能会导致冗余,增加维护开销,以及模型不同步时出错的可能性。

 

Remult 通过提供一个集成模型来解决这个问题。该模型定义了数据库模式,暴露了简单的 CRUD API,并支持客户端集成,使开发人员能够轻松地查询数据库,并且可以确保类型安全。

 

定义实体


Remult 使用装饰器将基本的 JavaScript 类转换为 Remult 实体。开发人员可以向类中添加 Entity 装饰器,并对每个属性应用相关的字段装饰器,从而轻松地完成这项工作。

 

使用装饰器,Remult 简化了创建实体及相关字段的过程,提高了开发人员的高效。

import { Entity, Fields } from "remult"

@Entity("contacts", { allowApiCrud: true})

export class Contact { @Fields.autoIncrement() id = 0 @Fields.string() name = "" @Fields.string() number = ""}
复制代码

 

服务器端设置


要开始使用 Remult,请将其与所选服务器上必要的实体一起注册。

 

幸运的是,Remult 针对几个流行的服务器框架提供了开箱即用的集成,包括 Express、Fastify、Next.js、Nest 和 Koa。

import express from "express";import { remultExpress } from "remult/remult-express";import Contact from "../shared/Contact.ts";

const app = express();

app.use( remultExpress({ entities: [ Contact ] }));
复制代码

 

客户端集成

配置完后端和实体后,下一步是将 Remult 与应用程序的前端集成。

 

幸运的是,Remult 的客户端集成被设计成库无关的。也就是说,它可以使用浏览器 fetch 功能或 Axios 进行操作。

 

为了说明这一点,请看下面的例子:


import { useEffect, useState } from "react"

import { remult } from "remult"import { Contact } from "./shared/Contact"const contactsRepo = remult.repo(Contact)

export default function App() { const [contacts, setContacts] = useState<Contact[]>([])

useEffect(() => { contactsRepo.find().then(setContact) }, [])

return ( <div> <h1>Contacts</h1> <ul> {contacts.map(contact => { return ( <div key={contact.id}> {contact.name} | {contact.phone} </div> ) })} </ul> </div> )}
复制代码

 

从这个例子可以看出,将 Remult 集成到应用程序前端非常简单、灵活。然后,开发人员就可以在整个栈中无缝地利用 Remult 的强大功能了。

 

Remult 是遵循MIT许可的开源软件。欢迎通过 Remult GitHub存储库做贡献。

 

原文链接:

https://www.infoq.com/news/2023/05/remult-crud-typescript/


相关阅读:

“TypeScript不值得!”前端框架Svelte作者宣布重构代码,反向迁移到JavaScript引争议

三年回顾:JavaScript与TypeScript最新特性汇总

TypeScript 5.0 现已发布:全新的装饰器,速度、内存和包大小优化

2023-06-05 08:0016714

评论

发布
暂无评论
发现更多内容

知识经济时代,企业该如何进行知识管理?

Baklib

效率工具 知识管理 企业 知识 知识经济

Spring Boot「09」Property 高级特性

Samson

Java 学习笔记 Spirng spring-boot 10月月更

2022-10-19:一个数组如果满足 : 升降升降升降... 或者 降升降升...都是满足的 给定一个数组, 1,看有几种方法能够剔除一个元素,达成上述的要求 2,数组天然符合要求返回0 3,剔

福大大架构师每日一题

算法 rust 福大大

Go语言 if判断和for循环实战 goto使用的那些坑

王中阳Go

Go golang 学习方法 面试题 10月月更

工赋开发者社区 | 最小可行架构注意事项:必须考虑分布式处理和数据的位置

工赋开发者社区

聊聊 K8S:K8S集群搭建实战

老周聊架构

k8s 10月月更

技术使用点-mixins的使用

默默的成长

前端 Vue 3 10月月更

ZooKeeper基本架构

穿过生命散发芬芳

zookeeper 10月月更

vivo 鲁班平台 RocketMQ 消息灰度方案

阿里巴巴云原生

阿里云 云原生 Apache RocketMQ

数据分析有 AI 帮你,Sugar BI 智能分析全场景介绍

Baidu AICLOUD

数据分析 可视化 BI

你会用Go语言的rune类型吗?

王中阳Go

Go golang 学习方法 数据处理 10月月更

工赋开发者社区 | 精益思想与数字化技术难融合?

工赋开发者社区

运维服务体系架构

阿泽🧸

10月月更 运维服务

nginx快速入门

Studying_swz

10月月更

Vue组件入门(十)Attributes 继承

Augus

Vue 3 10月月更

来了!2022 XDR网络安全运营新理念峰会即将开幕!

未来智安XDR SEC

网络安全

一起学习 Go 语言设计模式之单例模式

宇宙之一粟

设计模式 单例模式 Go 语言 10月月更

你一定要看的:Go slice切片详解和实战

王中阳Go

Go golang 高效工作 学习方法 10月月更

C/C++的类型转换

雪芙花

c c++ 10月月更

C++11智能指针(auto_ptr,unique_ptr,shared_ptr,weak_ptr的详解与模拟实现)

雪芙花

c c++ 10月月更

Pixel系列还能打,靠的是什么?

脑极体

人工智能

【Java深入学习】一个关于“锁”的程序-上

Geek_65222d

10月月更

超级app+轻应用带来的改变

Geek_99967b

小程序

SAP | Local结构和Global结构

暮春零贰

SAP 结构 10月月更

谷歌?新手不推荐 选它就对了

江拥羡橙

前端 工具 浏览器 谷歌 10月月更

工赋开发者社区 | Gartner发布2023年十大战略技术趋势

工赋开发者社区

数据产品经理那点事儿四

松子(李博源)

大数据 深度思考 高效工作 数据产品经理

工赋开发者社区 | 即使是程序员也会喜欢这8种无代码/低代码工具

工赋开发者社区

牛客刷题系列(完全数计算,扑克牌大小)

雪芙花

c c++ 10月月更

docker学习笔记(一)

Studying_swz

10月月更

docker学习笔记(二)

Studying_swz

Docker 10月月更

全栈TypeScript CRUD框架 Remult_大前端_Guy Nesher_InfoQ精选文章