Skip to main content
Version: 0.14.0

Basic Usage

Include Dyte's React component in your app#

DyteMeeting is a React component that can be included in your React application to show the Dyte Meeting UI.

It has 3 mandatory and 2 optional properties. The mandatory ones are defined below along with their usage, and the optional ones can be found here in the advanced usage page.

Pass Client ID for verification#

You need to pass a clientId prop to DyteMeeting to verify the participant's authToken against.

<DyteMeeting    clientId=`yourClientID`    >

Configure the meeting connection#

You need to pass a meetingConfig prop to DyteMeeting to define which meeting should the client connect to and a couple of other setup parameters, out of which only authToken and roomName are mandatory.

<DyteMeeting    clientId=`yourClientID`    meetingConfig={{        roomName: `roomName`,        authToken: `authToken`    }}    >

Get meeting instance on successful creation#

You need to pass an onInit prop to DyteMeeting to get reference to the meeting instance that is created. onInit expects a function which has a single param of type Meeting and is not expected to return anything. This Meeting reference can be used to take further actions and make customizations to the meeting.

<DyteMeeting    onInit={(meeting) => { }}    clientId=`yourClientID`    meetingConfig={{        roomName: `roomName`,        authToken: `authToken`    }}    >