Connect-irl NPM

Connect-IRL

Connect-IRL is a React SDK that makes it easy to integrate real-time video calling and chat functionality into your web applications. With Connect-IRL, you can quickly build applications where users can connect and communicate—just supply a room ID and a developer-provided user ID, and let our signaling server (hosted at https://real-olive.vercel.app) handle the rest.

Features

Video Calling: Peer-to-peer video calls powered by WebRTC and SimplePeer.
Real-Time Chat: Integrated chat functionality using Socket.IO.
Easy Integration: Pre-built React components (SDKVideoCall and SDKChat) that work out-of-the-box.
Centralized Signaling: All signaling (offer/answer negotiation, ICE candidates) is managed through our dedicated signaling server.

Installation

Install Connect-IRL via npm:

npm install connect-irl

Getting Started

Initialization

Before using any of the SDK components, initialize the SDK. The signaling server is preconfigured to use https://real-olive.vercel.app.

import { initSDK } from 'connect-irl';

Using the Components Connect-IRL exports two main components: SDKVideoCall and SDKChat. Both components expect a roomId and a developer-supplied userId (which maps internally to the component’s userName prop).

Here’s an example of how to use them in a React application:

import { Chat, VideoCall } from 'connect-irl';

const roomId = 'example-room';
const userName = 'User1';

const chat = new Chat(roomId, userName);
chat.connect();
chat.sendMessage('Hello!');

navigator.mediaDevices.getUserMedia({ video: true, audio: true }).then((stream) => {
  const videoCall = new VideoCall(roomId, userName, stream);
  videoCall.init();
});

API Reference

ns.

VideoCall

A React component for video calling. Props:

roomId (string): Unique identifier for the video call room.
userName (string): username given by client.

Additional props are forwarded to the underlying VideoCall component.

SDKChat

A React component for real-time chat.

Props:

roomId (string): Unique identifier for the chat room.
userName (string): User supplied userName.

Additional props are forwarded to the underlying Chat component.

Signaling Server

All video call signaling and chat messages are routed through our centralized signaling server at https://real-olive.vercel.app. Ensure that your client applications can access this endpoint for proper functionality.