me
Back to all articles
Post in FrenchFrench flag
Daryl Ngako

Convex, le backend ultime (j'aurais voulu connaître plus tôt)

Pourquoi j'ai abandonné Prisma et Supabase pour Convex, et pourquoi je ne reviendrai pas en arrière.

tutorieltypescriptbackend

J'ai passé des heures à débugger des trucs cassés avec Prisma. J'ai galéré à faire fonctionner le realtime avec Supabase. Et à chaque fois, j'avais l'impression de passer plus de temps à faire tourner la mécanique qu'à construire mon projet.

Puis j'ai découvert Convex.

Dans cet article, je te raconte mon vrai parcours de Prisma et Supabase vers Convex. Pourquoi j'ai switché, quand c'est le bon outil à utiliser, comment ça se compare aux autres, et aussi ce qui ne va pas (parce que rien n'est parfait).

Ce qui m'a fait fuir Prisma et Supabase

Avant de parler de Convex, je dois être honnête sur ce qui m'a poussé à chercher autre chose.

La galère des migrations avec Prisma

Prisma, c'est un très bon outil pour lire et écrire des données depuis ton app. L'autocomplétion TypeScript est top, tout est bien organisé. Mais dès que tu travailles en équipe ou sur plusieurs environnements (local, prod), ça devient pénible.

Tu fais une mise à jour de ta base de données en local, tout va bien. Tu déploies, et là... ça plante. Une modification entre en conflit avec une autre, ou pire, elle échoue sans te dire pourquoi. Tu te retrouves à réparer des fichiers que tu n'as pas vraiment écrits, à essayer de comprendre ce qui s'est passé. Si tu travailles en solo, le véritable inconvénient reste de devoir exécuter la commande npx prisma migrate dev à chaque modification du schéma.

Le realtime avec Supabase : possible, mais pas simple

Supabase, c'est solide. Une vraie base de données PostgreSQL, une gestion des utilisateurs intégrée, du stockage de fichiers. Pour une app classique où tu lis et écris des données, ça fait très bien le travail.

Mais quand j'ai voulu que plusieurs utilisateurs voient les changements des autres en temps réel, j'ai vite compris que ce n'était pas automatique.

Avec Supabase, pour afficher des données en direct, tu dois :

  • Écrire ta requête pour récupérer les données.
  • Écrire séparément un "abonnement" pour être prévenu quand quelque chose change.
  • Faire en sorte que les deux restent synchronisés côté client.

En gros, tu fais le même travail deux fois, et tu croises les doigts pour que ça reste cohérent. Sur un projet simple ça passe. Sur quelque chose de plus complexe, ça part vite en vrille.

C'est quoi Convex ?

Convex est une plateforme backend tout‑en‑un, orientée TypeScript et synchronisation en temps réel.

Imagine que tu n'aies plus à t'occuper de serveurs, de bases de données à configurer ou de mises à jour à synchroniser à la main.

Comment ça marche ?

Tu écris tes fonctions backend (queries, mutations, actions) en TypeScript dans un dossier convex/, tu les appelles depuis le frontend, et Convex se charge du reste, y compris de garder les données à jour en temps réel pour tous les utilisateurs connectés.

C'est un peu comme Firebase, mais fait pour les développeurs TypeScript, avec de vraies garanties sur la fiabilité des données.

Concrètement, Convex te donne :

  • Une base de données qui se met à jour toute seule : quand une donnée change, tous ceux qui la regardent la voient changer instantanément.
  • Des fonctions côté serveur en TypeScript : pas de SQL à écrire, juste du TypeScript.
  • Des transactions fiables : pas d'état incohérent, tout ou rien.
  • Un système de tâches planifiées intégré pour les jobs en arrière-plan.
  • Du stockage de fichiers inclus sans rien à brancher.

Ce qui m'a fait basculer : La création d'un réseau social

Le cœur du projet : que tout soit instantané. Un utilisateur publie quelque chose, tout le monde le voit. Immédiatement. Pas "après un rafraîchissement".

Avec Supabase, ça aurait voulu dire gérer manuellement les WebSockets, synchroniser l'état entre les clients, traiter les conflits de données... En gros, construire un sous-système entier avant même de commencer l'app.

Avec Convex, voilà tout ce que j'ai écrit :

posts.ts
// convex/posts.ts
import { v } from "convex/values";
import { mutation, query } from "./_generated/server";

export const createPost = mutation({
  args: { content: v.string(), attachmentIds: v.array(v.string()) },
  handler: async (ctx, args) => {
    const userId = await getAuthUserId(ctx);
    const postId = await ctx.db.insert("posts", {
      content: args.content,
      medias: args.attachmentIds,
      authorId: userId,
      createdAt: Date.now(),
    });
  },
});

export const getPosts = query({
  handler: async (ctx) => {
    const posts = await ctx.db.query("posts").order("desc").collect();
    return Promise.all(
      posts.map(async (post) => ({
        ...post,
        author: await ctx.db.get(post.authorId),
      })),
    );
  },
});
PostList.tsx
// app/src/components/PostList.tsx
import { useQuery } from "convex/react";
import { api } from "@/convex/_generated/api";

export function PostList() {
  const posts = useQuery(api.posts.getPosts);

  return (
    <div className="space-y-4">
      {posts?.map((post) => (
        <div key={post._id} className="p-4 border rounded">
          <p className="font-bold">{post.author?.name}</p>
          <p>{post.content}</p>
        </div>
      ))}
    </div>
  );
}

C'est tout. Pas de WebSocket à configurer. Pas de synchronisation à gérer à la main. Convex sait tout seul quelles données ton composant utilise. Quand quelqu'un ajoute un post, tout le monde le voit apparaître immédiatement car la liste se rafraîchit automatiquement.

Setup rapide de Convex avec Next.js

Assez parlé. Voici comment intégrer Convex dans un projet Next.js en moins de 5 minutes, pas de blabla, juste ce qu'il faut pour être opérationnel.

1. Installer Convex

Dans ton projet Next.js existant, une seule commande suffit :

npm install convex

2. Initialiser Convex

npx convex dev

Cette commande va :

  1. Te connecter à ton compte Convex (via GitHub)
  2. Créer un projet
  3. Créer le dossier convex/ à la racine de ton projet
  4. Lancer un serveur de développement qui synchronise ton code backend en temps réel

Elle va aussi créer automatiquement la variable d'environnement dans ton fichier .env.local. Vérifie juste qu'elle est bien là :

.env.local
NEXT_PUBLIC_CONVEX_URL=https://ton-projet.convex.cloud

Tu la laisses tourner pendant que tu développes, exactement comme next dev.

3. Créer le Provider

Convex a besoin d'un provider côté client pour connecter ton app au backend. Crée un fichier ConvexClientProvider.tsx :

ConvexClientProvider.tsx
// app/src/providers/ConvexClientProvider.tsx
"use client";

import { ConvexProvider, ConvexReactClient } from "convex/react";
import { ReactNode } from "react";

const convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!);

export function ConvexClientProvider({ children }: { children: ReactNode }) {
  return <ConvexProvider client={convex}>{children}</ConvexProvider>;
}

4. Brancher le Provider dans ton layout

Dernière étape : enveloppe ton app avec le provider dans le layout.tsx principal.

layout.tsx
// app/layout.tsx
import { ConvexClientProvider } from "./ConvexClientProvider";

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="fr">
      <body>
        <ConvexClientProvider>{children}</ConvexClientProvider>
      </body>
    </html>
  );
}

Et voilà. Ton app Next.js est connectée à Convex.

Quand utiliser Convex ?

Convex ne convient pas à tout. Mais dans ces situations, c'est vraiment là qu'il brille.

Quand plusieurs personnes travaillent en même temps

Outils de gestion de projet, docs collaboratifs, tableaux partagés. Si plusieurs personnes doivent voir les changements des autres en direct, Convex rend ça naturel.

Quand tu as besoin d'un tableau de bord en direct

Des chiffres qui se mettent à jour, des statuts qui changent, des alertes en temps réel. Tu récupères tes données une fois, Convex s'occupe de les garder à jour.

Pour lancer un projet rapidement

Pas de serveur à configurer, pas de base de données à installer, pas de cache à mettre en place. Tu démarres avec npx create-convex@latest et tu es opérationnel en quelques minutes. Idéal pour tester une idée vite.

Pour une équipe qui vit dans TypeScript et React

Si ton équipe est à l'aise avec TypeScript et React mais ne veut pas s'occuper d'infra, Convex est fait pour ça. Tout le monde peut toucher au backend sans apprendre SQL ni gérer des serveurs.

Pour des projets avec de l'IA

Convex gère bien les tâches longues en arrière-plan et les agents IA. Si tu construis quelque chose autour de l'IA, c'est une base solide.

Autre avantage de Convex : oublier la distinction client/server components.

Avec Convex, tout tourne côté client par défaut, le backend Next.js n'entre jamais en jeu. Plus besoin de se demander où s'exécute quoi.

Convex face aux autres : ce que ça donne vraiment

CritèreConvexSupabaseFirebasePrisma + DB
Realtime sans configOuiNon (manuel)OuiNon
Types auto dans le frontendOuiÀ générerNonÀ générer
SQLNonOuiNonOui
Mises à jour de la baseAutomatiquesFichiers à gérerNonFichiers à gérer
Idéal pourApps temps réel, MVPsApps avec beaucoup de relationsApps mobilesBase existante

En résumé : prends Convex si le temps réel est au cœur de ce que tu construis. Prends Supabase si tu as besoin de requêtes SQL complexes avec beaucoup de relations entre tes données. Garde Prisma si tu as déjà une base de données en place que tu ne veux pas toucher.

Les vrais inconvénients de Convex

Je t'ai montré ce que j'aime. Mais il y a des choses qui font mal, et tu mérites de les connaître.

Tu ne peux pas faire des requêtes complexes

Convex n'utilise pas SQL. Si ton app a besoin de croiser beaucoup de tables, de faire des calculs avancés sur tes données ou des statistiques poussées, tu vas vite te retrouver bloqué. C'est vraiment là où Supabase reste bien meilleur.

Moins de ressources qu'ailleurs

Supabase ou Firebase ont des milliers de tutos, de questions sur Stack Overflow, de plugins. Convex est plus récent, la communauté est plus petite. Quand tu bloques sur quelque chose de précis, tu vas souvent finir sur la doc officielle ou le Discord.

Mauvais choix si tu as déjà un backend

Convex est fait pour partir de zéro. Si tu essaies de le greffer sur un projet existant avec déjà beaucoup de logique côté serveur, tu vas te créer plus de problèmes que tu n'en résoudras.

Mon bilan honnête

Convex, c'est vraiment l'outil ultime pour créer des applications temps réel sans aucune configuration.

Fini la galère avec des migrations qui cassent, fini le code en double pour gérer la synchronisation.

Convex gère tout : le backend, le temps réel, la synchronisation, et le typage TypeScript.

Est-ce que c'est l'outil parfait pour tout ? Non. Si ton app a beaucoup de relations entre ses données et que tu as besoin de requêtes complexes, Supabase reste plus adapté. Si tu as déjà un projet Prisma qui tourne, ne touche à rien.

Mais si tu pars de zéro sur un projet TypeScript et React, que tu veux du temps réel sans te prendre la tête, et que tu veux aller vite ? Convex est exactement ce qu'il te faut.

N'hésite pas à tester et à me dire ce que tu en penses sur Linkedin !