Running Universal Dashboard in a Docker Instance


Universal Dashboard

Adam Driscoll the creator of the PowerShell Pro Tools for Visual Studio has created a new feature Universal Dashboard.
The PowerShell Pro Tools Universal Dashboard PowerShell module allows for creation of web-based dashboards. The client and server side code for the dashboard is authored all PowerShell. Charts, monitors, tables and grids can easily be created with the cmdlets included with the module. The module is cross-platform and will run anywhere PowerShell Core can run.

With this PowerShell Module you can easily create awesome Dashboards. After creating some cool Dashboards I thought it would be cool to test if you could also run the Universal Dashboard module in a Docker Instance.

Docker

I have a Windows 10 machine so I used the Docker for Windows Client to create Docker Containers on my Windows machine.

Docker is a software technology providing containers, promoted by the company Docker, Inc. Docker provides an additional layer of abstraction and automation of operating-system-level virtualization on Windows and Linux. [from Wikipedia] Please check the references if you want to learn more about Docker.

Example Universal Dashboard

With below Script we can create a Dashboard which retrieves Microsoft Stock prices calling a Web Service.

<#
    Example Dashboard for showing Microsoft Stock Value last 6 months.
    Links: 
    - Universial Dashboard: https://adamdriscoll.gitbooks.io/powershell-tools-documentation/content/powershell-pro-tools-documentation/universal-dashboard.html
    - Stock API: https://iextrading.com/developer/
#>
$Dashboard = Start-Dashboard -Content { 
    New-Dashboard -Title "Stockprice Dashboard" -Color '#FF050F7F' -Content {
        #Insert HTML Code
        New-Html -Markup '<h1>Running Universal Dashboard in Container!</h1>'
        New-Row {
            New-Column -Size 12 -Content {
                New-Chart -Type Line -Title "Stock Values - 6 months" -Endpoint {
                    (Invoke-RestMethod -Uri 'https://api.iextrading.com/1.0/stock/msft/chart/6m' -Method Get) | 
                        Out-ChartData -LabelProperty "date" -DataProperty "close"                    
                }
            }
        }
        New-Row {
            New-Column -Size 12 {
                New-Grid -Title "StockPrice MSFT" `
                    -Headers @('Date', 'Close Stock Value', 'Low Stock Value', 'High Stock Value') -Properties @('date', 'close', 'low', 'high') `
                    -DefaultSortColumn 'Date' -DefaultSortDescending  `
                    -Endpoint {
                    $StockData = Invoke-RestMethod -Uri 'https://api.iextrading.com/1.0/stock/msft/chart/6m' -Method Get 
                    $StockData | Out-GridData 
                }
            }
        }
        
    }
} -Port 9292

#Open Dashboard
Start-Process http://localhost:9292


#Stop Dashboard
#Stop-Dashboard -Server $Dashboard

If we run above script after installing the UniversalDashboard PowerShell Module and setting the Universal Dashboard License we get the following Dashboard.

Running Universal Dashboard in Docker Instance

We are going to use the microsoft/powerShell image to run our Universal Dashboard. This Docker image contains PowerShell Core.

Make sure you have installed the Docker Client for Windows and you have mounted your c-drive in the Docker Client. We will store the Universal Dashboard script on our c-drive.

High-level steps:

  1. Install the Docker for Windows Client
  2. Configure the Shared Drives (Map C-drive)
  3. Start Docker Windows Client
  4. Create Dashboard Script and store on your Windows C-drive.
  5. Download and install microsoft/powershell Docker image
  6. Start Docker microsoft/powershell instance
  7. Start Dashboard PowerShell script on Docker microsoft/powershell running instance.

I hope you where able to execute steps 1. to 3. yourself so I'll continue with how your Dashboard Script needs to look like.

<#
    Example Dashboard for showing Microsoft Stock Value last 6 months.
    Links: 
    - Universial Dashboard: https://adamdriscoll.gitbooks.io/powershell-tools-documentation/content/powershell-pro-tools-documentation/universal-dashboard.html
    - Stock API: https://iextrading.com/developer/
#>

#region install Universal Dashboard Module from PSGallery
Install-Module UniversalDashboard -Scope AllUsers -Force
#endregion

#region Set License
$License = Get-Content -Path '/data/license.txt'
Set-UDLicense -License $License
#endregion

#region Universal Dashboard
Start-Dashboard -Content { 
    New-Dashboard -Title "Stockprice Dashboard" -Color '#FF050F7F' -Content {
        #Insert HTML Code
        New-Html -Markup '<h1>Running Universal Dashboard on Docker Instance!</h1>'
        New-Row {
            New-Column -Size 12 -Content {
                New-Chart -Type Line -Title "Stock Values - 6 months" -Endpoint {
                    (Invoke-RestMethod -Uri 'https://api.iextrading.com/1.0/stock/msft/chart/6m' -Method Get) | 
                        Out-ChartData -LabelProperty "date" -DataProperty "close"                    
                }
            }
        }
        New-Row {
            New-Column -Size 12 {
                New-Grid -Title "StockPrice MSFT" `
                    -Headers @('Date', 'Close Stock Value', 'Low Stock Value', 'High Stock Value') -Properties @('date', 'close', 'low', 'high') `
                    -DefaultSortColumn 'Date' -DefaultSortDescending  `
                    -Endpoint {
                    $StockData = Invoke-RestMethod -Uri 'https://api.iextrading.com/1.0/stock/msft/chart/6m' -Method Get 
                    $StockData | Out-GridData 
                }
            }
        }
        
    }
} -Port 9090 -Wait
#endregion

This script will download and install the UniversalDashboard Module from the PSGallery and configure the license and start the Dashboard listening on port 9090.

Save the dockeruniversaldashboard.ps1 file on your c-drive.

Now it's time to start Docker and download the latest microsoft/powershell Docker image from the Docker Hub.

Open your PowerShell Command prompt (as Administrator) and search for the microsoft/powershell image.

If you have not downloaded the microsoft/powershell image run

docker pull microsoft/powershell

in the PowerShell Console.

With the command

docker images

you can see your installed Docker images.

Now we can run the following docker commands to start our Universal Dashboard hosted in the Docker microsoft/powershell instance.

docker run -d -p 9090:9090 --rm --name ud -i -v c:/Temp:/data microsoft/powershell 
docker exec -i ud  powershell -file ./data/dockeruniversaldashboard.ps1

Above docker commands start the Docker container with the ports mapped and the c:\temp folder mapped where we saved the dockeruniversaldashboard.ps1 file we created earlier.

The second command starts the PowerShell script in the Docker instance.

Here we see an animated gif showing  the end result.

Go buy your PowerShell Pro License and start creating cool Dashboards.

References:


Comments (3)

  1. The hotmail dashboard as table for the messages dives to different categories with powershell.

    1. Hi Hassan,

      It’s not clear to me what your question is. Can you please elaborate.

      Regards,
      Stefan

  2. Cragdoo says:

    Worth noting the Universal Dashboard cmdlets in your example code need to updated to the new format (Start-Dashboard is now Start UDDashboard etc) …see following updated code.

    Start-UDDashboard -Content {
    New-UDDashboard -Title “Stockprice Dashboard” -Color ‘#FF050F7F’ -Content {
    #Insert HTML Code
    New-UDHtml -Markup ‘Running Universal Dashboard on Docker Instance!’
    New-UDRow {
    New-UDColumn -Size 12 -Content {
    New-UDChart -Type Line -Title “Stock Values – 6 months” -Endpoint {
    (Invoke-RestMethod -Uri ‘https://api.iextrading.com/1.0/stock/msft/chart/6m’ -Method Get) |
    Out-UDChartData -LabelProperty “date” -DataProperty “close”
    }
    }
    }
    New-UDRow {
    New-UDColumn -Size 12 {
    New-UDGrid -Title “StockPrice MSFT” `
    -Headers @(‘Date’, ‘Close Stock Value’, ‘Low Stock Value’, ‘High Stock Value’) -Properties @(‘date’, ‘close’, ‘low’, ‘high’) `
    -DefaultSortColumn ‘Date’ -DefaultSortDescending `
    -Endpoint {
    $StockData = Invoke-RestMethod -Uri ‘https://api.iextrading.com/1.0/stock/msft/chart/6m’ -Method Get
    $StockData | Out-UDGridData
    }
    }
    }

    }
    } -Port 9090

Skip to main content