From 5c9f7a4017b9209450df258b07338866a96142fc Mon Sep 17 00:00:00 2001 From: szekelyzol Date: Mon, 16 Oct 2023 22:29:53 +0200 Subject: [PATCH 1/2] Add live stream demo page --- .../live-streaming/live-stream-demo.md | 38 +++++++++++++++++++ .../live-streaming/navigation.yaml | 2 + 2 files changed, 40 insertions(+) create mode 100644 templates/documentation/live-streaming/live-stream-demo.md diff --git a/templates/documentation/live-streaming/live-stream-demo.md b/templates/documentation/live-streaming/live-stream-demo.md new file mode 100644 index 00000000..b4e35ca2 --- /dev/null +++ b/templates/documentation/live-streaming/live-stream-demo.md @@ -0,0 +1,38 @@ +--- +title: "Demo - Start a live stream from your browser" +meta: + description: This demo enables you to use your webcam, your browser, and NodeJS to stream live video from a webpage to your users. +--- + +# Live streaming from your browser + +api.video offers a simple demo that enables you to use your webcam, your browser, and NodeJS to stream live video from a webpage directly to your users. You can try out the demo on this page: [livestream.a.video](https://livestream.a.video/) + +{% capture content %} +You may need to grant your browser permission to use your webcam and microphone. +{% endcapture %} +{% include "_partials/callout.html" kind: "info", content: content %} + +In the demo, you can adjust the live stream's resolution, frame rate, and audio bitrate. The speed of transcoding depends on the adjustments you make. + +The default RTMP destination URL used in this demo belongs to an api.video test account. To test streaming with your own account and your own RTMP destination, simply [sign up to api.video](https://dashboard.api.video/register) and create a live stream on the Dashboard. Check out the [Live stream quickstart](https://docs.api.video/live-streaming/create-a-live-stream#live-stream-immediately-from-your-dashboard) for more details about creating live streams. + +## Features + +- Live streaming webcam via from your browser +- Adjusting stream resolution, frame rate, and audio bitrate +- Setting up custom RTMP destination + +## GitHub repo + +Check out the demo's repository GitHub [here](https://github.com/apivideo/browserLiveStream). + +To clone the repo, run this command in your git command line: + +``` +$ git clone https://github.com/apivideo/api.video-typescript-media-stream-composer +``` + +## Usage + +Once you have cloned the repository, follow the [installation steps](https://github.com/apivideo/browserLiveStream#installation) on GitHub to set the demo up. \ No newline at end of file diff --git a/templates/documentation/live-streaming/navigation.yaml b/templates/documentation/live-streaming/navigation.yaml index 8014e382..7b289247 100644 --- a/templates/documentation/live-streaming/navigation.yaml +++ b/templates/documentation/live-streaming/navigation.yaml @@ -10,6 +10,8 @@ - heading: Templates & demos items: + - label: Live streaming from your browser + href: /live-streaming/live-stream-demo.md - label: Creating a live stream external: https://api.video/blog/tutorials/live-stream-tutorial/ - label: Hosting and watching a live stream From e39153db1be5f65d6ab19526311477a24953ba3f Mon Sep 17 00:00:00 2001 From: szekelyzol Date: Mon, 16 Oct 2023 22:37:12 +0200 Subject: [PATCH 2/2] Update git clone url --- templates/documentation/live-streaming/live-stream-demo.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/templates/documentation/live-streaming/live-stream-demo.md b/templates/documentation/live-streaming/live-stream-demo.md index b4e35ca2..31660fbb 100644 --- a/templates/documentation/live-streaming/live-stream-demo.md +++ b/templates/documentation/live-streaming/live-stream-demo.md @@ -30,7 +30,7 @@ Check out the demo's repository GitHub [here](https://github.com/apivideo/browse To clone the repo, run this command in your git command line: ``` -$ git clone https://github.com/apivideo/api.video-typescript-media-stream-composer +$ git clone https://github.com/apivideo/browserLiveStream ``` ## Usage