Live-Streaming Site in 30 Mins

In 3 Small Steps

This guide came about when I tried creating a video live-streaming site.

I had started with a harder task: running the live-streaming service on the public internet, both for public viewers and potential streamers.

I’d started with following this guide, but encountered difficulty configuring everything about the networking behind a VPC + loadbalancer.

Instead, I found a much shorter route to my proof-of-concept: running everything locally on my Macbook.


If not installed already, install:

1. Receive Stream via RTMP (~2mins)

We can use a pre-existing Docker image, tiangolo/nginx-rtmp.

The image contains our prerequisites: nginx + the nginx-rtmp-module plugin.

In your local terminal, run:

$ docker run -d -p 1935:1935 --name nginx-rtmp tiangolo/nginx-rtmp

And to verify that the Docker container is running (in the background):

$ docker ps

You should see output like this:

CONTAINER ID        IMAGE                 COMMAND                  CREATED             STATUS              PORTS                    NAMES
031c98b488b8        tiangolo/nginx-rtmp   "nginx -g 'daemon of…"   30 minutes ago      Up 3 seconds>1935/tcp   nginx-rtmp

We now have a server that will now act as a proxy between our video stream:

  1. producer (camera hardware) and
  2. consumers (web player, mobile app, or otherwise).

Next steps…

2. Broadcast Stream via RTMP to Server (~1min)

In OBS, navigate to “Settings” -> “Stream”, and select “Custom” from the dropdown.

Enter rtmp:// in the hostname.

Enter test as the streaming key. Note: this key can be modified to support multiple streams.

Click “Ok”, and “Start streaming”.

3. Consume Stream (~2-5mins)

Lastly, create an index.html file in a scratch directory on your filesystem, copy-pasting this content:

        <link href="" rel="stylesheet" />
        <script src="">&</script>
        <script src="">&</script>
        <video id="my-video"
			 class="video-js vjs-default-skin vjs-big-play-centered"
			 data-setup='{"techorder" : ["flash","html5] }'>
            <source src="rtmp://" type="rtmp/mp4"/>


          var player = videojs('my-video');

If you need help serving the file up to be viewed in your browser, run the following in your terminal in the same directory as your index.html:

$ python -m http.server

Or if you have Python 2:

$ python -m SimpleHttpServer

You can then open the page in your browser at http://localhost:8000/ to see your livestream.

You will need to enable Flash for this page in order for the video player to play (TODO: add details of how to do this in Chrome/Safari/Firefox).


The end resulting livestream in Chrome

Future Goals

  1. Publish stream to a public domain name, e.g
  2. Host the video-player at a public domain name
  3. Remove need for Flash video player (encode from RTMP to HLS)
  4. Implement player in:
    1. Android app
    2. iOS app
    3. TV app?
  5. Load test & identify CDN/scaling costs and options


· cameras, video-conferencing, video