This is just an exercise and not a great technical content in both NODE and PowerShell. I was helping my friend to achieve his needs in PowerShell and fixed all issues as planned. All happens over a coffee right? Here comes a question from him! How can I show data processed using PowerShell in fancy HTML over the browser? For our demo let’s show first 10 windows services! Our goal is to deliver the below shown output –

Name	DisplayName	Status
AdobeARMservice	Adobe Acrobat Update Service	Stopped
AdobeFlashPlayerUpdateSvc	Adobe Flash Player Update Service	Stopped
AgentService	AgentService	Running
AJRouter	AllJoyn Router Service	Stopped
ALG	Application Layer Gateway Service	Stopped
AppHostSvc	Application Host Helper Service	Running
AppIDSvc	Application Identity	Stopped
Appinfo	Application Information	Running
AppMgmt	Application Management	Stopped
AppReadiness	App Readiness	Stopped

All PowerShell lovers, as you guessed it’s first 10 services using the below snippets

Get-Service | Select-Object Name , DisplayName , Status -First 10

Let’s keep the PowerShell part aside (Yeah, nothing tricky over there 🙂 ). We need to test the output by building dynamic table and for that a JSON format is required! So, let us use the sample JSON as illustrated below

var services = [
    {
        "Name": "AdobeARMservice",
        "DisplayName": "Adobe Acrobat Update Service",
        "Status": "Stopped"
    },
    {
        "Name": "AdobeFlashPlayerUpdateSvc",
        "DisplayName": "Adobe Flash Player Update Service",
        "Status": "Stopped"
    }
]

Yes, I don’t want to build tables rows and map the values for table data! If we use ConvertTo-Html our goal is achieved in one go! So, to achieve the same using PUG over NODE JS use the below snippet (It’s a PUG code)

tbody
        tr
            th Name
            th DisplayName
            th Status
        each service in result
            tr
                td=service.Name 
                td=service.DisplayName 
                td=service.Status

Here comes the server.js route – For now it’s on default “/” route

app.get('/', function (request, response) {
    response.render('index', {
        result: services
    })
})

services is a JSON object assigned to the result variable. In PUG file we loop through items of JSON using each statement! Below illustrated image is our final result!

Full code is shown below – Please share your feedback for any corrections!

INDEX – PUG (Index.pug)

doctype html
head
    style.
        #services {
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        border-collapse: collapse;
        width: 100%;
        }
        #services td,
        #services th {
        border: 1px solid #ddd;
        padding: 8px;
        }
        #services tr:nth-child(even) {
        background-color: #f2f2f2;
        }
        #services tr:hover {
        background-color: #ddd;
        }
        #services th {
        padding-top: 12px;
        padding-bottom: 12px;
        text-align: left;
        background-color: #4CAF50;
        color: white;
        }
table#services
    tbody
        tr
            th Name 
            th DisplayName 
            th Status 
        each service in result
            tr
                td=service.Name 
                td=service.DisplayName 
                td=service.Status 

SERVER.JS (JavaScript)

var express = require('express'),
    app = express(),
    path = require('path'),
    bodyparser = require('body-parser'),
    pug = require('pug'),
    shell = require('node-powershell'),
    ps = new shell({
        executionPolicy: 'bypass',
        noProfile: true
    });
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.get('/', function (request, response) {
    ps.addCommand("./scripts/ServiceInformation.ps1")
    ps.invoke().then(output => {
        var services = JSON.parse(output)
        response.render('index', {
            result: services
        })
    })
})

app.listen(3000)
console.log('Your application is hosted!')

Do you really need the PowerShell snippet used in ServiceInformation.ps1 ? Here it is and don’t forget to use the Compress switch!

Get-Service | 
Select-Object Name , DisplayName , Status -First 10 | 
ConvertTo-Json -Compress

Enjoy PowerShell!