成功运行后，你将体验到：
·主播端： 包含专业混流布局、设备控制、实时互动的完整开播界面。
·观众端： 支持观看高清直播、弹幕互动聊天、礼物打赏。
一、开通服务
请参考 开通服务 领取 TUILiveKit 体验版，并在 应用管理 页面获取以下信息:
·SDKAppID：应用标识（必填），腾讯云基于 SDKAppID 完成计费统计。
·SDKSecretKey：应用密钥，用于初始化配置文件的密钥信息。
二、环境准备
·现代浏览器：支持 WebRTC APIs 的现代浏览器。
·设备：摄像头、麦克风、扬声器。
·Node.js：≥ 18.19.1（推荐使用 LTS 版本，可通过 node -v 命令查看当前版本）。
三、获取 Demo
1. 从 GitHub 下载 TUILiveKit React Demo 源码，或者直接在命令行运行以下命令：
git clone https://github.com/Tencent-RTC/TUIKit_React.git
2. 安装依赖。
cd TUIKit_React/demos/live-vite-reactnpm install
四、配置 Demo
你需要参考这篇的前提条件，在项目根目录下，打开 src/config/basic-info-config.js 文件，输入开通服务时获得的 SDKAppID 和 SDKSecretKey：
五、编译并运行 Demo
npm run dev
工程成功运行后，将自动打开一个浏览器并进入直播列表页面，此时可能因为你的应用无人开播，看到空的直播列表页面。
六、直播推流与观看
应用启动后，默认进入登录页面，输入用户 ID，例如：“host” 进行登录。登录成功后，跳转到直播列表页面，首次运行，通常因无人开播显示空列表，可以点击右上角的开始直播按钮，进入开播页面。
七、使用 React Demo 观看直播
开播成功后，刷新通过 npm run dev 命令启动的浏览器页面（通常是 http://localhost:5173），此时会显示你刚刚开启的直播，从直播列表中点击，即可进入观看页面。
八、作为主播，开始直播
开播页面，如下所示，首先需要在左侧添加画面源，然后在中间排版区域调整好布局，最后点击下方开始直播按钮，开启直播推流。
·左侧画面源区域，可以添加摄像头、屏幕分享、窗口分享、本地图片。
·中间视频排版区域，支持对添加的画面源拖拽、缩放、层级调整等操作。
·右侧直播互动区域，支持收发文字、表情消息，查看观众列表。
九、作为观众，观看直播
打开一个无痕浏览器窗口，或者另一个不同的浏览器软件，使用不同的用户 ID 登录，例如：“guest” 登录后，找到刚刚开播的直播间，从直播列表点击进入。
进入直播间后，可在直播间内进行观看视频、关注当前主播、发送弹幕、查看观众列表等操作。
注意：说明：
注意：为了更好地体验直播功能的完整性，建议你使用不同的 userId 来模拟多个观众：
十、下一步
Demo 跑通后，你可以根据业务需要，参考下表中的集成指引文档，将对应功能集成到你的项目中：
| 页面 | 文档链接 |
| 准备工作 | 准备工作（Web React） |
| 观众观看 | 观众观看（React） |
| 直播列表 | 直播列表（React） |
十一、售前咨询
当你需要购买咨询时，你可以直接通过 售前咨询 进行提问，会有专属客户经理在线为你解答，为你提供专业的上云方案。同时，你也可以直接致电销售人员，咨询热线：4009100100转1（工作日9:00 – 18:00）。
十二、售后支持
当你遇到问题需要处理时，你可以直接通过 售后支持 进行提问，腾讯云工程师7 × 24小时在线为你提供服务。同时，你也可以直接致电客服人员，寻求相应的帮助，客服咨询：4009100100（7 × 24小时）。