Logo Astro Collaborative Starter
You
Users online

Astro collaborative starter

A set of collaborative elements for Astro, powered by Liveblocks

Welcome!

Looking to add collaboration to Astro? You've come to the right spot, Astronaut 🚀 This starter kit contains a set of quick and easy elements for adding multiplayer presence to your app. But is it really that easy?

---
import LiveblocksRoom from 'astro-collab/LiveblocksRoom.astro'
import LiveCursors from 'astro-collab/LiveCursors.astro'

const key = import.meta.env.PUBLIC_LIVEBLOCKS_PUBLIC_KEY
---
<LiveblocksRoom room-id="my-room" public-key={key}>
  <LiveCursors />
</LiveblocksRoom>

Bam! A few lines of code, and you've already got multiplayer cursors. To learn more, take a look at the quick start guide, visit the GitHub repo, or have a play with the demos below.

Quick start

Quick start guide
Introduction

Components

Multiplayer cursors
<LiveCursors>
Live avatar stack
<LiveAvatars>
Live user list
<LiveUsers>
Collaborative form
<LiveForm>
Edit user form
<LiveUserForm>
Live drawing
<LiveDrawing>
Random user info
<RandomUserInfo>
Liveblocks room
<LiveblocksRoom>
@ctnicholasdev