Neat-RTC: WebRTC wrapper for React and Vue

Welcome, this is my recently created module, it makes WebRTC easier to use with features like:

• Built-in signaling
• Simplified mediastream, datachannel usage
• Ready to use React, Vue examples
• Detailed description

Try the package at NPM
Check browser compatibility

What is WebRTC?

WebRTC is an HTML5 specification that you can use to add encrypted, real-time media/data communications directly between browsers or devices.

Have a nice day!

tamasszoke / neat-rtc

WebRTC wrapper for peer-to-peer (P2P) communication with built-in signaling for React and Vue.

Neat-RTC

WebRTC wrapper with built-in signaling for React and Vue.

Support the project

Roadmap

These are the planned updates of the project.

• Choose device option
• File sharing example

Overview

1. Install the package
2. Import, configure, create an instance
3. Wire up signaling on client-side
4. Setup signaling on server-side
5. Using mediastream, datachannel

Install

npm install neat-rtc

Usage

Import

import NeatRTC from 'neat-rtc';

Configure

const config = {
  devMode: true,
  videoIdLocal: 'localVideo',
  videoIdRemote: 'remoteVideo',
  connected: connected,
  mediaStreamConnected: mediaStreamConnected,
  mediaStreamRemoved: mediaStreamRemoved,
  mediaStreamRemoteRemoved: mediaStreamRemoteRemoved,
  datachannels: [
    {
      name: 'text',
      callbacks: {
        open: datachannelOpen,
        message: datachannelMessage,
        error: datachannelError,
        close: datachannelClose
      }
    }
  ]
};

Important: you have to set up all of the callback functions above.

RTCPeerConnection configuration (optional)

Add the following properties to the above config object.

connectionConfig: set the STUN/TURN servers and other connection options, for more information check the RTCConfiguration dictionary. Default value:

{
  iceServers: [
    {

…

View on GitHub