2 min read

Categories

Tags

8381892061_eb3babe76a_m First of all let’s clarify what Zen Coding actually is. According to their website: Emmet (formerly known as Zen Coding) is …

... a web-developer’s toolkit that can greatly improve your HTML & CSS workflow.

But what does this have to do with PowerShell? At least I find myself quite often trying to convert PowerShell output into HTML or even using the text manipulation capabilities of PowerShell to dynamically construct some static web content. Yes, I hear you shouting already isn’t that why we have ConvertTo-HTML and Here-Strings (and here)? Granted that those can make the job already pretty easy (I would definitely recommend you to have a look into Creating HTML Reports in PowerShell if you haven’t yet), but there is still an even better way to (dynamically) generate static HTML pages from within PowerShell. Before looking into the implementation details let’s have a look at some examples on what zen coding looks like (considering we would have a PowerShell function called zenCode that expands zen code expressions): [code language=”powershell”] zenCode ‘html:5’ <# output:

#> zencode ‘ul.generic-list>(li.item>lorem10)*4’ <# output:

  • Sapien elit in malesuada semper mi, id sollicitudin urna fermentum.

  • Sapien elit in malesuada semper mi, id sollicitudin urna fermentum.

  • Sapien elit in malesuada semper mi, id sollicitudin urna fermentum.

  • Sapien elit in malesuada semper mi, id sollicitudin urna fermentum.

#> zencode ‘div+div>p>span+em^bq’ <# output:

	__

#> zencode ‘html>head>title+body>table>tr>th{name}+th{ID}^(tr>(td>lorem2)3)2’ <# output:

		<table >
			<tr >
				name
				ID
			</tr>
			<tr >
Dolor sit. Dolor sit. Dolor sit.
			</tr>
			<tr >
Dolor sit. Dolor sit. Dolor sit.
			</tr>
		</table>

#> [/code] You can have a look at the Zen Coding Cheat Sheet for more examples The syntax might look a bit cryptic at the first glance but once you get the hang of it it’s pretty easy. While this is all already pretty cool I wanted a way to combine this with the PowerShell pipeline in order to do things like that: [code language=”powershell”] zenCode ‘ul>li.item{$_}’ <# output

  • 5

  • 4

  • 3

  • 2

  • 1

#> gps | zenCode ‘html>head>title+body>table>tr>th{name}+th{ID}^(tr>td{$.name}+td{$.id})’ <# output (excerpt):

		<table >
                            <tr >
conhost 14956
			</tr>
			<tr >
csrss 600
			</tr> #> gps | select -first 10 | zenCode 'html>head>title+body>table[border=1]>(tr>td{$_.Name}+td{$_.ID})+td{$_.Modules | select -first 10}' <# output (excerpt):

	
	
		<table border="1" >
			<tr >
				Name
				ID
				Modules
			</tr>
			<tr >
iexplore 8048
			</tr>
			<tr >
iexplore 8488 pstypenames BaseAddress Container EntryPointAddress FileName FileVersionInfo ModuleMemorySize ModuleName Site Company Description FileVersion Product ProductVersion Size
System.Diagnostics.ProcessModule
System.ComponentModel.Component
System.MarshalByRefObject
System.Object
18612224 18619984 C:\Program Files (x86)\Internet Explorer\IEXPLORE.EXE File: C:\Program Files (x86)\Internet Explorer\IEXPLORE.EXE InternalName: iexplore OriginalFilename: IEXPLORE.EXE.MUI FileVersion: 11.00.9600.16428 (winblue_gdr.131013-1700) FileDescription: Internet Explorer #> [/code] The solution to make this happen relies on the zencoding implementation [Mad Kristensen](http://madskristensen.net/) has developed (https://github.com/madskristensen/zencoding) which he has also made part of his awesome [Web Essentials](http://vswebessentials.com/) Visual Studio extension. I've made a PowerShell function (Get-ZenCode alias zenCode) and also an ISE Add-on that expand Zen Code expressions and also work with the PowerShell pipeline. Get-ZenCode also supports output to a file (outPath parameter) and showing the result in the default browser (-Show Switch). I'm posting the source code for Get-ZenCode below but you can also download the same including full help and more examples from [my GitHub page](https://github.com/DBremen/ISEUtils/blob/master/functions/Get-ZenCode.ps1) (the function requires the [zenCoding.dll](https://github.com/madskristensen/zencoding) within a resources subfolder) . The ISE Add-On (including Get-ZenCode) is part of my [ISEUtils](https://github.com/DBremen/ISEUtils) Add-On. With the Add-On the expressions can be typed into the Editor (without the preceding zenCode call) and expanded by pressing CTRL+SHIFT+J (or the respective menu entry): ![ExpandZenCode](https://powershellone.files.wordpress.com/2015/11/expandzencode.gif) https://gist.github.com/06aeb0bcdcc1d57f04d6 How do you like Zen Coding? ![shareThoughts](https://powershellone.files.wordpress.com/2015/10/sharethoughts.jpg) * * * Photo Credit: [jurvetson](https://www.flickr.com/photos/44124348109@N01/8381892061/) via [Compfight](http://compfight.com) [cc](https://creativecommons.org/licenses/by/2.0/)