please select

Run Sample Code

This document mainly introduces how to quickly run through the Conference (TUIRoomKit) sample project and experience a high-quality multi-person video conference. By following this document, you can run through the demo within 10 minutes and ultimately experience a multi-person video conference feature with a complete UI interface.




Prerequisites

Node.js version: Node.js ≥ 16.19.1 (we recommend using the official LTS version, please match the npm version with the node version).
Modern browser, supporting WebRTC APIs.

Download Demo

1. Open the Terminal, copy and paste the sample command to clone the repository.
2. Install dependencies.
Vue3
Vue2
cd ./TUIRoomKit/Web/example/vite-vue3-ts
cd ./TUIRoomKit/Web/example/webpack-vue2.7-ts
npm install

Configure Demo

1. Activate the TUIRoomKit service,get the SDKAppID and SDKSecretKey.



2. Open the TUIRoomKit/Web/example/vite-vue3-ts/src/config/basic-info-config.js file and enter the SDKAppID and SDKSecretKey you got when you activated the service:



Note:
For Vue2 projects, open the TUIRoomKit/Web/example/webpack-vue2.7-ts/src/config/basic-info-config.js file and enter the SDKAppID and SDKSecretKey you got when you activated the service.

Run Demo

1. Run Demo by typing the command in the terminal.
Vue3
Vue2
# cd TUIRoomKit/Web/example/vite-vue3-ts
npm run dev
# cd TUIRoomKit/Web/example/webpack-vue2.7-ts
npm run serve
Note:
For local environment, please access under localhost protocol, please refer to the description of network access protocol.
2. Open a browser page and enter the corresponding URL.




Create your first conference

Click on the New Room button to create your first meeting room. The room types are On-stage Speaking Room or Free Speech Room.
1. Free speech room



2. On-stage Speaking Room




Join conference

Participants can join a meeting created by the meeting host by filling in the corresponding RoomId.