Comment ajouter des signatures électroniques à votre application Wasp

Wasp est un framework full-stack pour React, Node.js et Prisma qui vous permet de définir l'authentification, les actions du serveur et les entités de base de données dans un fichier de configuration déclaratif. Leur modèle Open SaaS est livré clé en main avec l'authentification, les paiements et une base de données, et c'est l'un des modèles de SaaS les plus populaires sur GitHub avec plus de 10 000 étoiles. Si vous construisez un produit SaaS sur Wasp, l'ajout de signatures électroniques est une étape logique pour tout ce qui concerne le domaine juridique, les ressources humaines, le conseil ou l'immobilier.

Firma.dev s'intègre directement avec les actions serveur de Wasp et les modèles Prisma. Vous définissez une action Wasp, appelez l'API de Firma.dev depuis votre code côté serveur et suivez le tout dans votre base de données existante. Pas d'infrastructure externe, pas de nouveaux services à gérer.

Comment ça marche (version courte)

L'architecture de Wasp rend cela propre. Vous déclarez une action serveur dans votre fichier de configuration .wasp, l'implémentez en TypeScript et l'appelez depuis n'importe quel composant React. L'action s'exécute côté serveur (ainsi votre clé API ne touche jamais le navigateur), crée une demande de signature via l'API de Firma.dev et stocke le résultat dans votre base de données Prisma. Le signataire reçoit le document par e-mail ou via une iframe intégrée dans votre application.

Lorsque le document est signé, Firma.dev envoie un webhook à une route API Wasp qui met à jour le statut de la demande de signature dans votre base de données. Votre frontend récupère automatiquement le changement grâce aux requêtes réactives de Wasp.

Si vous utilisez déjà Open SaaS, vous disposez déjà de l'authentification, d'une base de données et des actions serveur. L'intégration de Firma.dev ajoute peut-être 100 lignes de code réparties sur deux fichiers.

Sous le capot

Pour les développeurs qui souhaitent comprendre l'architecture avant de se plonger dans la documentation :

L'intégration comprend quatre éléments. Tout d'abord, une entité Prisma SigningRequest qui suit chaque demande de signature avec son identifiant Firma.dev, son modèle, l'e-mail du signataire et son statut. Deuxièmement, une action Wasp sendSigningRequest qui lit votre clé API depuis .env.server, appelle le point de terminaison create-and-send de Firma.dev et écrit le résultat dans votre base de données. Wasp gère automatiquement le RPC client-serveur, de sorte que votre composant React appelle simplement l'action comme une fonction asynchrone classique.

Troisièmement, un gestionnaire de webhook déclaré comme une route api Wasp (avec auth: false puisque les webhooks ne contiennent pas de jetons de session) qui écoute les événements tels que signing_request.completed et met à jour vos enregistrements Prisma. Quatrièmement, un composant de signature intégré en option : une iframe pointant vers https://app.firma.dev/signing/{id} qui permet aux signataires de compléter les documents sans quitter votre application.

Le tout fonctionne avec la sécurité de typage de Wasp. Vous tapez les entrées et sorties de votre action, et Wasp déduit automatiquement les types sur le frontend.

Vous pouvez également connecter le serveur Docs MCP de Firma.dev à Cursor ou Claude pendant le développement, afin que votre assistant IA puisse se référer à la documentation complète de l'API lorsqu'il génère le code d'intégration.

Ce que vous obtenez

Une fois connectée, votre application Wasp peut envoyer des documents pour signature à partir de n'importe quel modèle Firma.dev, suivre les mises à jour de statut en temps réel via les webhooks et Prisma, intégrer la signature directement dans votre interface utilisateur et déclencher des flux de travail en aval lorsque les documents sont finalisés.

Chaque signature est juridiquement contraignante en vertu de la loi ESIGN, de l'UETA et d'eIDAS (SES et AdES). Toutes les données des documents sont stockées dans l'UE sur l'infrastructure AWS à Paris et Stockholm.

Si vous construisez un SaaS multi-locataire, les Espaces de travail client de Firma.dev offrent à chacun de vos clients leur propre environnement de signature isolé, avec des modèles et un suivi de l'utilisation distincts. Cela s'associe parfaitement avec les modèles multi-locataires de Wasp.

Des tarifs adaptés aux créateurs de SaaS

Open SaaS existe parce que payer de 300 $ à 2 000 $ pour du code de démarrage semblait déraisonnable. La même logique s'applique aux signatures électroniques. La plupart des fournisseurs facturent entre 25 $ et 50 $ par utilisateur et par mois, ce qui s'accumule rapidement lorsque la signature n'est qu'une fonctionnalité parmi d'autres dans votre produit.

Firma.dev facture 0,029 € (environ 3 centimes de dollar) par enveloppe. Pas de frais mensuels, pas de frais par utilisateur, pas de contrat. Vous déployez la fonctionnalité et ne payez que lorsque les enveloppes sont envoyées. Pour un SaaS en phase de démarrage sur Open SaaS, cela signifie que vous pouvez vous lancer avec des signatures électroniques dès le premier jour sans ajouter une ligne de dépense de 300 $/mois à votre budget.

Commencer

Le guide d'intégration complet de Wasp sur docs.firma.dev détaille chaque étape : définir l'entité Prisma, créer l'action serveur, configurer les webhooks et intégrer l'expérience de signature. Si vous avez déjà créé une action Wasp auparavant, vous aurez des demandes de signature opérationnelles en moins d'une heure.

Commencez à utiliser Firma.dev gratuitement, sans carte de crédit requise.