Cet outil open source remplace Bubble et Retool (Appsmith)

BBetter Stack
Computing/SoftwareSmall Business/StartupsInternet Technology

Transcript

00:00:00La plupart des développeurs sur-utilisent l'ingénierie pour leurs outils internes, et avouons-le, nous le savons tous.
00:00:04Vous lancez React, connectez des API, créez l'authentification et gérez l'état juste pour livrer un tableau de bord qui n'est au fond que
00:00:10des formulaires et des tableaux. Voici AppSmith, un outil open source avec plus de 39 000 étoiles qui peut
00:00:16remplacer la majeure partie de tout cela en quelques minutes. Considérez-le comme l'alternative open source à Bubble,
00:00:21et je vais vous montrer comment cela fonctionne en quelques minutes seulement.
00:00:29Maintenant, AppSmith n'est pas tout nouveau, mais on n'en parle toujours pas aussi souvent qu'on le devrait.
00:00:34Il n'est pas conçu pour des pages de destination ou des applis clients, mais uniquement pour des outils internes. On a une interface en glisser-déposer,
00:00:41mais avec du JavaScript complet pour ne jamais être bloqué. Vous connectez des bases de données, des API, des outils SaaS,
00:00:47et vous utilisez toujours Git comme un développeur normal. Ici, pas de verrouillage propriétaire et nous pouvons l'auto-héberger
00:00:54entièrement gratuitement, avec en plus des utilisateurs illimités. La vraie question est donc : cela fait-il gagner du temps ?
00:01:00Laissez-moi vous montrer. Si vous aimez les outils open source et les astuces de codage comme celle-ci,
00:01:04n'oubliez pas de vous abonner. Nous publions des vidéos tout le temps. Une fois AppSmith lancé,
00:01:10vous créerez un compte rapide, c'est super simple. Ensuite, sur votre tableau de bord, vous pouvez démarrer une nouvelle application avec un canevas vide.
00:01:15Comme ce n'est pas un tutoriel complet, je vais simplement choisir la base de données Postgres prédéfinie,
00:01:21mais vous pouvez voir ici toutes les options que nous avons réellement pour construire notre projet,
00:01:26ce qui est vraiment appréciable. Une fois que j'ai une base de données, dans mon cas Postgres, liée, c'est terminé.
00:01:32Dans la base de données, il y a un tas de tables avec lesquelles vous pouvez jouer, mais je vais choisir
00:01:36la table des employés car elle contient des utilisateurs fictifs. Maintenant, je vais insérer un tableau,
00:01:42choisir de me connecter à la bonne table de la base de données. Elle se remplit instantanément, puis je peux
00:01:47ajouter un formulaire de saisie et un bouton de validation. Vous voyez comme tout cela est du "glisser-jouer",
00:01:52et sur la barre latérale, je peux même lier des requêtes et même du JavaScript.
00:01:55J'ai déjà lié les données au tableau, mais ici je peux faire une requête avec le champ de saisie pour chercher
00:02:01un utilisateur dans notre base de données. Et voilà, c'est fait. On ajoute un déclencheur à notre bouton pour mettre à jour, peut-être
00:02:07une notification toast, on clique sur déployer, et voilà une application CRUD fonctionnelle. C'est super basique car j'aborde
00:02:12tout cela en seulement quelques minutes, mais je sais que vous voyez la réelle polyvalence derrière
00:02:17tout cela et à quel point ce serait rapide dans un flux de travail aussi. Pas de configuration React, pas de couche API, pas de câblage d'auth.
00:02:23Cela a pris peut-être une minute, deux tout au plus, d'accord ? Et vous avez toujours le contrôle total avec JavaScript,
00:02:28les thèmes et Git. Donc oui, c'est gratuit, c'est rapide, donc pas besoin de payer pour Bubble ou autre chose.
00:02:34C'est un excellent outil à lancer rapidement. AppSmith, c'est essentiellement l'UI d'un côté, les données de l'autre,
00:02:40et le JavaScript pour tout connecter. Les widgets gèrent votre interface, les sources de données se connectent aux bases de données,
00:02:46aux API, même aux LLM, et les requêtes sont juste du SQL, du REST ou du JavaScript. L'idée clé est que le JavaScript est
00:02:54partout. La plupart des outils low-code vous cachent la logique, alors que celui-ci l'expose. C'est pourquoi
00:03:00les développeurs changent. Git fonctionne comme prévu, avec branches, fusions, CI/CD, rien de bizarre,
00:03:06et vous pouvez l'auto-héberger avec Docker ou Kubernetes. Ainsi, vous contrôlez vos données et vos coûts. Vous pouvez
00:03:12créer des composants personnalisés avec React ou du JavaScript pur, et c'est prêt pour la production avec
00:03:18le RBAC, les journaux d'audit et le SSO intégrés. Cela dit, il y a évidemment de l'IA,
00:03:23mais l'important est qu'elle génère du code que vous pouvez réellement modifier. Ça semble parfait, peut-être,
00:03:30mais ça ne l'est pas, d'accord ? S'il est efficace pour gagner du temps car on peut livrer plus vite, et honnêtement,
00:03:36après l'avoir utilisé, cela semble assez exact. Il est bien open source, donc vous n'êtes pas enfermé
00:03:42dans un modèle de tarification. On ne reste pas bloqué car on peut toujours y injecter du JavaScript,
00:03:47et si vous l'auto-hébergez, c'est gratuit avec des utilisateurs illimités. Mais d'un autre côté, avec le temps ou l'échelle,
00:03:52cela peut quand même casser. Si vous essayez d'afficher d'énormes ensembles de données côté client,
00:03:58cela peut ralentir, vous voudrez donc une pagination côté serveur. Les mises en page mobiles ne sont pas automatiques.
00:04:04Vous devrez les ajuster manuellement. Et si vous venez de la gestion d'état sans code,
00:04:08cela peut sembler vraiment déroutant au début. Et l'UI est légèrement en retrait par rapport à des outils comme Retool si vous voulez
00:04:14des tableaux de bord sophistiqués. Rien de tout cela n'est crucial, mais cela compte selon votre cas d'utilisation.
00:04:20Alors, où cela se situe-t-il réellement ? La vraie comparaison est Retool contre AppSmith. Retool
00:04:26est plus poli et possède des fonctionnalités plus puissantes, mais il est cher et propriétaire. AppSmith est
00:04:32moins raffiné. C'est de l'open source, n'est-ce pas ? Mais tout vous appartient. Le coût est de zéro si vous l'auto-hébergez.
00:04:39Bubble et Webflow ne sont pas vraiment comparables car ce sont plutôt des applis destinées aux clients,
00:04:44mais ils font beaucoup de choses similaires et cool. Tooljet est plus proche, mais AppSmith
00:04:49se démarque toujours par une meilleure intégration Git. Donc si votre but est de livrer des outils internes rapidement,
00:04:55AppSmith est généralement un meilleur compromis. Si vous aimez les outils open source et les astuces de codage comme celle-ci,
00:05:00n'oubliez pas de vous abonner à la chaîne BetterStack. On se voit dans une prochaine vidéo.

Key Takeaway

AppSmith réduit le temps de développement des outils internes de plusieurs jours à quelques minutes en remplaçant l'ingénierie complexe par une interface glisser-déposer entièrement personnalisable par JavaScript et Git.

Highlights

AppSmith est une alternative open source à Bubble et Retool comptabilisant plus de 39 000 étoiles sur GitHub.

L'outil permet de déployer une application CRUD fonctionnelle en moins de deux minutes sans configurer React ou l'authentification.

L'auto-hébergement via Docker ou Kubernetes rend l'utilisation gratuite pour un nombre d'utilisateurs illimité.

Le JavaScript est intégré partout dans la plateforme pour lier les données, créer des requêtes SQL ou définir des composants personnalisés.

Le flux de travail supporte la gestion de versions avec Git, incluant les branches, les fusions et le CI/CD.

L'affichage de jeux de données massifs nécessite une pagination côté serveur pour éviter les ralentissements du client.

Les interfaces pour mobiles demandent un ajustement manuel car la mise en page n'est pas automatique.

Timeline

Simplification du développement d'outils internes

  • L'ingénierie excessive pour les tableaux de bord internes ralentit inutilement les cycles de livraison.
  • AppSmith automatise la gestion de l'état, l'authentification et la connexion aux API.
  • Cette solution cible exclusivement les outils internes plutôt que les pages de destination publiques.

Le développement traditionnel d'outils internes implique souvent l'utilisation de React et la gestion complexe des API pour de simples formulaires. AppSmith élimine ces étapes répétitives tout en conservant la flexibilité du code. L'absence de verrouillage propriétaire permet aux développeurs de garder le contrôle total sur leurs applications.

Construction rapide d'une application CRUD

  • La connexion à une base de données Postgres permet de peupler instantanément des tableaux de données.
  • L'interface se construit par glisser-déposer de widgets comme des champs de saisie et des boutons.
  • L'ajout de déclencheurs comme les notifications toast ou les mises à jour se fait en un clic.

Le processus commence par la sélection d'une source de données parmi de nombreuses options prédéfinies. Une table d'employés peut être liée à un widget de tableau en quelques secondes. L'intégration de scripts JavaScript dans la barre latérale permet de filtrer les résultats ou de valider des formulaires sans quitter l'interface visuelle.

Architecture technique et fonctionnalités avancées

  • Le système repose sur une séparation claire entre l'interface utilisateur, les sources de données et la logique JavaScript.
  • Les fonctionnalités de production incluent le RBAC, les journaux d'audit et le SSO intégré.
  • L'IA intégrée génère du code source modifiable manuellement par l'utilisateur.

Contrairement aux outils low-code qui masquent la logique, cette plateforme expose le code pour faciliter la personnalisation. Les sources de données s'étendent des bases SQL classiques aux modèles de langage (LLM). La gestion native de Git assure une intégration fluide dans les pipelines de développement professionnels.

Avantages, limites et comparaisons du marché

  • L'auto-hébergement supprime les frais liés au nombre d'utilisateurs propres aux modèles SaaS.
  • La performance peut se dégrader lors du traitement de gros volumes de données côté client.
  • Retool offre une interface plus polie mais impose un coût élevé et un écosystème fermé.

Bien que l'outil soit performant pour la rapidité, il nécessite une gestion rigoureuse de la pagination pour les grandes échelles. L'interface utilisateur est moins sophistiquée que celle de Retool, mais l'aspect open source garantit la souveraineté des données. Pour les outils internes, le compromis entre coût et flexibilité avantage généralement cette solution gratuite.

Community Posts

View all posts