In this post, we will look at how to use two other HTML-based PowerShell modules in conjunction with Universal Dashboard. First, we will see how we can use PSHTML to add elements to pages. Second, we will look at how to use PSWriteHtml to produce static HTML pages on the fly using Universal Dashboard.

PSHTML

PSHTML is a PowerShell module built by Stephane Van Gulick that allows you to use PowerShell syntax to output HTML. The module complements Universal Dashboard well. Although Universal Dashboard provides similar functionality with New-UDElement and New-UDHtml, PSHTML offers a much more terse syntax that may improve readability. It also covers more of the standard HTML tags than UD does.

When you invoke a PSHTML function, an HTML string will be returned.

Using the New-UDHtml cmdlet in UD, you can send the HTML output from PSHTML directly into your dashboard.

This is handy and works great for single elements. One problem you may have is that you don’t want to call New-UDHtml for every single element you create with PSHTML. To work around this, you can join the strings together and pass them as a single value to New-UDHtml.

PSHtml in UD

Some caveats that you need to be aware of is that creating elements in this way does not create React components. It’s only producing DOM elements and you won’t be able to use things like Set-UDElement and New-UDElement. Another issue is that you won’t be able to nest UD components within a PSHTML element.

This, for example, will not work.

There is the concept of React Portals that we could utilize to make UD components work this way but it’s not currently implemented.

PSWriteHtml

PSWriteHtml is a PowerShell module developed by Przemysław Kłys. This module is capable of generating static HTML pages that can have tables, charts, and diagrams (among many other things). There are a bunch of cool examples on Przemysław Kłys’ blog.

Since PSWriteHtml generates entire HTML pages, you can’t necessarily just output the result of the cmdlets into a UD cmdlet. What you can do is generate the HTML document and then display the document either via a link or an iFrame in UD.

PSWriteHtml diagram in UD

One great thing about Universal Dashboard is that it’s dynamic. You could easily generate PSWriteHtml documents on the fly and then show them in Universal Dashboard via UDInput or modals.

Dynamic PSWriteHtml

Conclusion

In this post, we went over how to use PSHTML and PSWriteHtml to generate elements that you can include in your Universal Dashboard websites.