mirror of
https://github.com/supabase/supabase.git
synced 2026-06-18 21:54:18 +08:00
80 lines
3.1 KiB
Plaintext
80 lines
3.1 KiB
Plaintext
---
|
|
id: 'realtime'
|
|
title: 'Realtime'
|
|
description: 'Send and receive messages to connected clients.'
|
|
subtitle: 'Send and receive messages to connected clients.'
|
|
hideToc: true
|
|
---
|
|
|
|
Supabase provides a globally distributed [Realtime](https://github.com/supabase/realtime) service with the following features:
|
|
|
|
- [Broadcast](/docs/guides/realtime/broadcast): Send low-latency messages between clients. Perfect for real-time messaging, database changes, cursor tracking, game events, and custom notifications.
|
|
- [Presence](/docs/guides/realtime/presence): Track and synchronize user state across clients. Ideal for showing who's online, or active participants.
|
|
- [Postgres Changes](/docs/guides/realtime/postgres-changes): Listen to database changes in real-time.
|
|
|
|
## What can you build?
|
|
|
|
- **Chat applications** - Real-time messaging with typing indicators and online presence
|
|
- **Collaborative tools** - Document editing, whiteboards, and shared workspaces
|
|
- **Live dashboards** - Real-time data visualization and monitoring
|
|
- **Multiplayer games** - Synchronized game state and player interactions
|
|
- **Social features** - Live notifications, reactions, and user activity feeds
|
|
|
|
Check the [Getting Started](/docs/guides/realtime/getting_started) guide to get started.
|
|
|
|
## Examples
|
|
|
|
<div className="grid md:grid-cols-12 gap-4 not-prose">
|
|
<div className="col-span-6">
|
|
<Link href="https://multiplayer.dev" target="_blank" passHref>
|
|
<GlassPanel title="Multiplayer.dev">
|
|
Showcase application displaying cursor movements and chat messages using Broadcast.
|
|
</GlassPanel>
|
|
</Link>
|
|
</div>
|
|
<div className="col-span-6">
|
|
<Link href="https://supabase.com/ui/docs/nextjs/realtime-chat" target="_blank" passHref>
|
|
<GlassPanel title="Chat">
|
|
Supabase UI chat component using Broadcast to send message between users.
|
|
</GlassPanel>
|
|
</Link>
|
|
</div>
|
|
<div className="col-span-6">
|
|
<Link href="https://supabase.com/ui/docs/nextjs/realtime-avatar-stack" target="_blank" passHref>
|
|
<GlassPanel title="Avatar Stack">
|
|
Supabase UI avatar stack component using Presence to track connected users.
|
|
</GlassPanel>
|
|
</Link>
|
|
</div>
|
|
<div className="col-span-6">
|
|
<Link href="https://supabase.com/ui/docs/nextjs/realtime-cursor" target="_blank" passHref>
|
|
<GlassPanel title="Realtime Cursor">
|
|
Supabase UI realtime cursor component using Broadcast to share users' cursors to build
|
|
collaborative applications.
|
|
</GlassPanel>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
|
|
## Resources
|
|
|
|
Find the source code and documentation in the Supabase GitHub repository.
|
|
|
|
<div className="grid md:grid-cols-12 gap-4 not-prose">
|
|
<div className="col-span-6">
|
|
<Link href="https://github.com/supabase/realtime" passHref>
|
|
<GlassPanel title="Supabase Realtime">View the source code.</GlassPanel>
|
|
</Link>
|
|
</div>
|
|
<div className="col-span-6">
|
|
<Link
|
|
href="https://supabase.com/blog/supabase-realtime-multiplayer-general-availability"
|
|
passHref
|
|
>
|
|
<GlassPanel title="Realtime: Multiplayer Edition">
|
|
Read more about Supabase Realtime.
|
|
</GlassPanel>
|
|
</Link>
|
|
</div>
|
|
</div>
|