Remult est une bibliothèque CRUD complète qui simplifie le processus de développement en tirant parti des formulaires TypeScript, en fournissant un client API et un générateur de requêtes de type sécurisé.
Dans le développement de logiciels, deux modèles de données doivent être gérés et synchronisés pour garantir le bon fonctionnement du système : les modèles serveur et client. Les modèles de serveur définissent la structure de la base de données et l’API, tandis que les modèles client définissent les données transmises vers et depuis l’API.
Cependant, le maintien d’ensembles de modèles et de validateurs distincts peut entraîner une redondance, une augmentation des coûts de maintenance et un potentiel d’erreurs lorsque les modèles ne sont plus synchronisés.
Remult résout ce problème en fournissant un modèle intégré qui définit le schéma de la base de données, expose des API CRUD simples et prend en charge l’intégration côté client qui permet aux développeurs d’interroger la base de données, tout en maintenant facilement la sécurité des types.
Définir les entités
Remult utilise des décorateurs pour convertir les classes JavaScript de base en entités Remult. Les développeurs peuvent facilement y parvenir en ajoutant le concepteur d’entités à la classe et en appliquant les décorateurs de champs pertinents à chaque propriété.
Avec les décorateurs, Remult simplifie le processus de création d’entités et de leurs domaines associés, les rendant plus efficaces et intuitifs pour les développeurs.
import { Entity, Fields } from "remult"
@Entity("contacts", {
allowApiCrud: true
})
export class Contact {
@Fields.autoIncrement()
id = 0
@Fields.string()
name = ""
@Fields.string()
number = ""
}
Configuration côté serveur
Pour commencer à utiliser Remult, enregistrez-le avec les entités nécessaires auprès du serveur choisi.
Heureusement, Remult fournit des intégrations non traditionnelles pour de nombreux frameworks de serveurs populaires, notamment Express, Fastify, Next.js, Nest et 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
]
})
);
Intégration côté client
Après avoir configuré le backend et les entités, l’étape suivante consiste à intégrer Remult au frontend de l’application.
Heureusement, l’intégration du client de Remult est conçue pour être indépendante de la bibliothèque, ce qui signifie qu’elle peut s’exécuter à l’aide des capacités de récupération du navigateur ou d’Axios.
Pour illustrer cette fonctionnalité, considérons l’exemple suivant :
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>
)
}
Cet exemple démontre la facilité et la flexibilité avec lesquelles Remult peut être intégré dans le front-end d’une application, permettant aux développeurs d’exploiter de manière transparente la puissance et les fonctionnalités de Remult sur l’ensemble du package.
Remult est un logiciel open source disponible sous Licence du Massachusetts Institute of Technology. Nous accueillons les contributions via Remult Référentiel Github.
« Évangéliste amateur de zombies. Créateur incurable. Fier pionnier de Twitter. Amateur de nourriture. Internetaholic. Introverti hardcore. »
More Stories
Le changement de nom d’utilisateur prévu de Discord cause de sérieux inconvénients
Twitter dit qu’un «incident de sécurité» a rendu publics des tweets sur un «cercle privé»
Top 9 des jeux pour les fans d’Assassin’s Creed 🗡️