API

API Reference

Wrapper Functions

Factory Method	Parameters (? = optional)	Return Value	Reference
createClient	ClientConfig	A hook that gives a client object	AgoraRTC.createClient
createMicrophoneAndCameraTracks	AudioConfig?, VideoConfig?	A hook that gives an object containg tracks (microphone and camera), state variables ready: set to true when the feeds are initialised & error: set to null if the hook suceeds or contains the error object	createMicrophoneAndCameraTracks
createBufferSourceAudioTrack	BufferSourceAudioTrackInitConfig	A hook that gives an object containg the audio track, state variables ready: set to true when the feeds are initialised & error: set to null if the hook suceeds or contains the error object	AgoraRTC.createBufferSourceAudioTrack
createCameraVideoTrack	CameraVideoTrackInitConfig?	A hook that gives an object containg the camera video track, state variables ready: set to true when the feeds are initialised & error: set to null if the hook suceeds or contains the error object	AgoraRTC.createCameraVideoTrack
createCustomAudioTrack	CustomAudioTrackInitConfig	A hook that gives an object containg the custom audio track, state variables ready: set to true when the feeds are initialised & error: set to null if the hook suceeds or contains the error object	AgoraRTC.createCustomAudioTrack
createCustomVideoTrack	CustomVideoTrackInitConfig	A hook that gives an object containg the custom video track, state variables ready: set to true when the feeds are initialised & error: set to null if the hook suceeds or contains the error object	AgoraRTC.createCustomVideoTrack
createMicrophoneAudioTrack	MicrophoneAudioTrackInitConfig?	A hook that gives an object containg the microphone audio track, state variables ready: set to true when the feeds are initialised & error: set to null if the hook suceeds or contains the error object	AgoraRTC.createMicrophoneAudioTrack
createScreenVideoTrack	ScreenVideoTrackInitConfig?, withAudio?	A hook that gives an object containg tracks (audio and video), state variables ready: set to true when the feeds are initialised & error: set to null if the hook suceeds or contains the error object	AgoraRTC.createScreenVideoTrack

All methods take in the same parameters as the NG SDK. You can visit the official docs for each methods to know more.

Components

AgoraVideoPlayer

This component lets you display a video track in the DOM. You can pass in the videoTrack as prop along with other props that get passed to the rendered div containing your video.

Note: You need to pass in the height & width for the video player using the style prop (or className/id) which is applied to the resultant div containig the video, otherwise the renderd div is of size 0px.

Props

videoTrack (required): ILocalVideoTrack | IRemoteVideoTrack | ICameraVideoTrack

config?: videoPlayerConfig

Example:

<AgoraVideoPlayer videoTrack={track} className="video" key={key} style={{height: '100%', width: '100%'}} />

Wrapper Functions Examples

createClient

import React from "react";
import { createClient } from "agora-rtc-react";

const config = {mode: "rtc", codec: "vp8"}
const useClient = createClient(config);

const App = () => {
  const client = useClient();

  useEffect(() => {
    client.join(appId, name, token, null);
  }, [])

  return (
    <p>{client.uid}</p>
  )
}

createMicrophoneAndCameraTracks

import React from "react";
import { createMicrophoneAndCameraTracks, AgoraVideoPlayer } from "agora-rtc-react";

const useMicrophoneAndCameraTracks = createMicrophoneAndCameraTracks();

const App = () => {
  const { ready, tracks } = useMicrophoneAndCameraTracks();

  return (
    ready && <AgoraVideoPlayer videoTrack={tracks[1]} style={{height: '100%', width: '100%'}} />
  )
}

All other create methods use a similar pattern.

Other AgoraRTC Methods

For other RTC SDK methods you can directly use them from the AgoraRTC object. Look at the example using the wrapper for group videocall here to understand better.