How tejxs18/vibesync works
VibeSync is a browser-based collaborative listening platform. Users discover or join public and password-protected rooms, search YouTube tracks to play or queue, then listen in sync while managing playback and chatting. The server handles room membership, shared playback and queue state, chat history, and listener counts; the client provides the lobby and room experience. The README documents invite links and cleanup, and the sampled server code shows in-memory room cleanup. Some component implementations were not sampled, so uncertain wiring is omitted.
Main entry points: index.js HTTP and Socket.IO · App.jsx Lobby and room · SyncAudioPlayer.jsx Synced player · SearchBar.jsx Track search
Components 13
Client experience
- Lobby and room
client/src/App.jsx - Socket provider
client/src/context/SocketContext.jsx - Track search
client/src/components/SearchBar.jsx - Synced player
client/src/components/SyncAudioPlayer.jsx - Room chat
client/src/components/ChatBox.jsx - Music visualizer
client/src/components/MusicVisualizer.jsx - Invite sharing
client/src/components/ShareButton.jsx
Room runtime
- HTTP and Socket.IO
server/index.js - Room state
server/index.js - Search endpoint
server/index.js
Music integration
- YouTube search
- YouTube playback
Other components
- Listener
Connections 16
- Listener → Lobby and room: uses
- Lobby and room → Socket provider: uses socket
- Lobby and room → HTTP and Socket.IO: fetches rooms
- Lobby and room → HTTP and Socket.IO: joins room
- Track search → Search endpoint: searches tracks
- Search endpoint → YouTube search: queries
- Track search → HTTP and Socket.IO: selects or queues
- Synced player → HTTP and Socket.IO: syncs playback
- Room chat → HTTP and Socket.IO: sends and reads chat
- HTTP and Socket.IO → Room state: reads and updates
- HTTP and Socket.IO → Lobby and room: sends room updates
- HTTP and Socket.IO → Synced player: broadcasts playback and queue
- HTTP and Socket.IO → Room chat: broadcasts messages
- Synced player → YouTube playback: controls playback
- Synced player → Music visualizer: passes play state
- Lobby and room → Invite sharing: provides room ID