DEV Community

Alex Spinov
Alex Spinov

Posted on

Convex Has a Free Reactive Backend — Real-Time Data Without WebSockets Code

Real-Time Is Hard. Convex Makes It Easy.

Building real-time features means WebSockets, event handling, reconnection logic, and state sync. A chat feature takes days to build properly.

Convex: Backend That Updates in Real-Time

Convex is a reactive backend where queries automatically re-run when data changes. No WebSocket code. No polling.

Free Tier

  • Generous free usage for hobby projects
  • Automatic real-time sync
  • Built-in auth, file storage, scheduled functions
  • ACID transactions on every mutation

How It Works

Define your backend:

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

export const list = query({
  handler: async (ctx) => {
    return ctx.db.query("messages").order("desc").take(50)
  }
})

export const send = mutation({
  args: { body: v.string(), author: v.string() },
  handler: async (ctx, { body, author }) => {
    await ctx.db.insert("messages", { body, author })
  }
})
Enter fullscreen mode Exit fullscreen mode

Use in React:

import { useQuery, useMutation } from "convex/react"
import { api } from "../convex/_generated/api"

function Chat() {
  const messages = useQuery(api.messages.list)
  const sendMessage = useMutation(api.messages.send)

  // messages AUTOMATICALLY UPDATE when anyone sends a message
  // No WebSocket code. No polling. No refetching.

  return (
    <div>
      {messages?.map(m => <p key={m._id}>{m.author}: {m.body}</p>)}
      <button onClick={() => sendMessage({ body: "Hello!", author: "Alice" })}>
        Send
      </button>
    </div>
  )
}
Enter fullscreen mode Exit fullscreen mode

Convex vs Supabase vs Firebase

Feature Convex Supabase Firebase
Real-time Automatic Subscribe Listeners
Transactions ACID PostgreSQL Limited
Type safety Full Partial None
Backend logic TypeScript functions SQL + Edge Cloud Functions
Vendor lock-in High Low High

Install

npm install convex
npx convex dev
Enter fullscreen mode Exit fullscreen mode

Build real-time apps with live data. 88+ scrapers on Apify. Custom: spinov001@gmail.com

Top comments (0)