# Tencent RTC Live — Vue > Live documentation for Vue platform. ## UIKit ### Run the Demo - [Run the Demo](https://pre.trtc.io/document/66940.md): The TUILiveKit Demo is a live streaming SDK demo that enables developers to quickly set up and run a fully featured online live streaming application on web platforms. This guide walks you through prerequisites, environment setup, demo installation, running, and customization steps. It helps users enable the service, configure credentials, and experience host streaming and audience viewing with interactive features such as bullet comments and audience connection requests. ### Video Live Streaming - [Integration](https://pre.trtc.io/document/66938.md): TUILiveKit is a live streaming SDK designed for web applications using Vue 3 on desktop browsers. It enables developers to quickly implement live streaming features including host streaming, audience viewing, and interactive live streaming controls. This quickstart guide covers service activation, environment setup with Node.js and Vue, dependency installation, secure login integration, and functional usage steps. It also highlights protocol requirements for production deployment to ensure WebRTC compatibility. - [Host Streaming](https://pre.trtc.io/document/73741.md): The TUILiveKit Host Live Streaming SDK for Web Vue3 desktop browsers provides a comprehensive guide to embedding and customizing the live streaming start page. It is designed for developers who want to integrate live streaming features such as multi-camera scene management, audience interaction, host PK, and customizable layouts. This quickstart guide covers environment setup, dependency installation, page integration, and starting the live stream with detailed steps. - [Audience Watching](https://pre.trtc.io/document/73747.md): The TUILiveKit Viewer Page is a web desktop browser SDK designed for live audience viewing. It enables developers to quickly integrate a pre-built viewer page into their projects with features like high-definition live video playback, real-time chat interaction, audience list display, and fullscreen mode. This guide walks through environment setup, dependency installation, viewer page integration, and project startup steps, while also providing customization options and solutions for browser autoplay restrictions. - [Live Stream List](https://pre.trtc.io/document/73760.md): The Live Stream List Page in TUILiveKit is a web desktop browser SDK designed for developers to quickly integrate or customize live streaming list features. This guide covers environment setup, dependency installation, page integration, and project startup steps to enable seamless live stream list functionality. It also provides options for UI customization and routing configuration to designate live streaming rooms. ### Live Management System - [Quick Start](https://pre.trtc.io/document/74097.md): The Live Streaming Management System SDK offers comprehensive live streaming operations capabilities including live monitoring, room management, gift configuration, and content moderation for Web Vue Desktop Browser. This quick start guide helps developers set up the environment, activate services, download the project, configure the server and frontend, and deploy the system efficiently. Key steps include environment preparation, service activation, project cloning, server configuration, and frontend startup to enable rapid integration and testing. - [SDK Customization](https://pre.trtc.io/document/81896.md): TUILiveKit Manager Vue SDK is a live streaming management SDK designed for Vue 3 developers. It enables customization of the live streaming management console by providing core Hooks for live room, gift, and risk control management. This quick start guide covers environment setup, service activation, backend server configuration, dependency installation, and HTTP client initialization to help developers quickly integrate and customize live streaming features. ### UI Customization - [Live Stream Video Component](https://pre.trtc.io/document/74036.md): The LiveView live stream video component SDK for Web desktop browsers enables developers to integrate ultra-low-latency live streaming with smart stream switchover and customizable UI. This quickstart guide covers environment setup, dependency installation, joining live rooms, and performing voice chat to help you quickly implement interactive live streaming experiences. - [Video Source Editing Canvas](https://pre.trtc.io/document/74037.md) - [Audience List](https://pre.trtc.io/document/74038.md): The Audience List Component (LiveAudienceList) SDK enables real-time display of online audiences in live streaming rooms on web desktop browsers. It is designed for developers integrating live streaming features who need responsive and customizable audience lists. This quickstart guide covers environment setup, dependency installation via npm, pnpm, or yarn, and step-by-step instructions to embed and customize the component within your Vue3 project. - [Comment View](https://pre.trtc.io/document/74039.md): The Barrage Component for Web Desktop Browser is a UI component set designed for real-time message display and input in live streaming applications. It includes the BarrageList component for managing and rendering barrage messages and the BarrageInput component for rich text message sending with emoji support and status management. This guide provides detailed steps to configure the environment, install dependencies, and integrate the components into your project, along with customization options to tailor the UI and functionality to your needs. - [Gift Component](https://pre.trtc.io/document/77818.md): The LiveGift component from TUILiveKit is a Vue3 SDK designed for React web applications on desktop browsers. It enables displaying configured gift lists, sending gifts, and playing 3D and video gift animations. This guide provides step-by-step instructions including prerequisites, dependency installation, component integration, and importing default gifts. It also outlines next steps for backend integration to support custom gifts, billing callbacks, PK score conversion, and analytics. - [Media Source Configuration Panel](https://pre.trtc.io/document/74040.md): The Media Source Configuration Panel (LiveScenePanel) is a web desktop browser SDK component designed for seamless integration into existing projects. It enables users to manage multiple media types such as camera, screen sharing, images, videos, and text with real-time preview and device configuration. This guide walks through environment setup, dependency installation, component integration, and style customization steps to help developers quickly implement and tailor the panel to their needs. - [Link Management Panel](https://pre.trtc.io/document/74041.md): Link Management Panel (CoGuestPanel) is a Vue3-based SDK component designed for web desktop browsers to manage mic connection requests and statuses in real time. This quickstart guide targets developers integrating the panel into existing projects, providing step-by-step instructions for environment setup, dependency installation via npm, pnpm, or yarn, and usage examples. It also covers customization of the panel's style through CSS variables to tailor the UI to specific needs. ### Advanced Features - [OBS Studio Integration](https://pre.trtc.io/document/69784.md): LiveKit streaming guide provides step-by-step instructions to use OBS Studio for streaming external media sources into live rooms. This guide targets streamers and broadcasters aiming to deliver game streaming, esports commentary, or local video broadcasts with low latency and high quality. It covers obtaining the OBS stream URL via Live Management System or Server APIs, configuring OBS Studio server settings, optimizing video and output parameters, and setting advanced options for stable streaming. ### Error Codes - [Error Codes](https://pre.trtc.io/document/60027.md): Tencent RTC Error Codes document lists detailed error codes for API callbacks and RESTful APIs, helping developers troubleshoot issues related to user rendering, room management, audio/video permissions, device access, and network restrictions. This guide is designed for developers integrating Tencent RTC SDKs to efficiently identify error causes and apply appropriate solutions. ### Release Notes - [Release Notes](https://pre.trtc.io/document/67291.md): Tencent RTC SDK release notes provide detailed updates on new features, optimizations, and bug fixes across Android, iOS, Web, and Flutter platforms. This documentation helps developers track enhancements like multi-template video mixing, Picture-in-Picture API, live stream management APIs, and stability improvements to ensure better audio and video communication experiences. ### UserSig Authentication - [UserSig Authentication](https://pre.trtc.io/document/35166.md): This guide explains how to calculate UserSig, a security signature for Tencent-RTC services, during the debugging phase. It covers obtaining SDKAppID and SDKSecretKey from the Tencent-RTC console and generating UserSig using client sample code on multiple platforms including Android, iOS, Web, Windows, Flutter, and Mac. The steps ensure secure authentication for developers testing Tencent-RTC SDKs before official deployment.