My Development Environment 2021

Starting up a new development environment from fresh can be fun. Sure it's a hassle when you've gotta get to doing, but when there's been some new hotness out, it becomes an exciting time to see what's out there. I want something cool - so here's the result of an evening setting up.

VS Code

Theme

I had seen SynthWave '84 around for awhile in tweets and now it's my turn. I had bookmarked this tweet as my inspiration:

With a simple click to install (and following the extra step for the glow effect), my environment is now so extra, but I love it:

Font

If you want your font filled with neat glyphs, head to Nerd Fonts or check out the Github repo. Emma from the tweet above picked Fira Code as her font, Nick Craver went with Delugia, Scott Hanselman further below with Caskaydia Cove, and I decided on Code New Roman.

Icons

I went with the very popular Material Icon Theme.

Powershell

This is the new Powershell and I had previously downloaded it from the Github repo but I recently found out, it's also available from the Microsoft Store meaning it will auto update!

Windows Terminal

I've written about the new terminal before but with Scott Hanselman's post on My Ultimate PowerShell prompt with Oh My Posh and the Windows Terminal I decided it was time to jazz up mine. Similar to Powershell, I've grabbed Windows Terminal from the Microsoft Store, because who wants to worry about manually installing updates?

However on launch I didn't like the order of my profiles. There's an open Github issue around reordering in the UI, but isn't resolved yet. The workaround is to manually sort the profiles in the settings.json file.

Font

I'm going to keep the same font as I used in VS Code: Code New Roman. I'll also set it to be the default font for everything in Windows Terminal by adding it to the "defaults" section under "profiles".

Oh My Posh

Oh My Posh is a prompt theme engine. There are installation methods depending on your platform. I originally wanted to use the Windows installation via winget. Though I ran into two issues with this:

• I couldn't use the easy Get-PoshThemes, available only to the Powershell version. The winget equivalent is a few lines of Powershell
• I wanted to use the Execution Time segment and I couldn't work out how to get it working for the winget installation

For me this means the Powershell installation.

Install-Module oh-my-posh

I restarted Windows Terminal for the $PATH to be updated - I actually restarted my PC as other updates were pending. As I'm using the Powershell version, I found the pre-installed themes under:

%UserProfile%\Documents\PowerShell\Modules\oh-my-posh\5.7.0\themes

From here I copied one of the existing themes and renamed it to make it mine: niko.omp.json.

Then I opened my $PROFILE and threw in the following:

Import-Module -Name oh-my-posh
Set-PoshPrompt -Theme niko

Beginning to configure Oh My Posh felt overwhelming because the customisation is deep. But after looking at the other themes, and online - the "segments" I wanted were:

• Session
• Path
• Git information
• If running under admin
• Time (been on my mind for years!)
• Duration of last call

With those in mind, I present you with what my Oh My Posh looks like, and the json for it.

{
  "$schema": "https://raw.githubusercontent.com/JanDeDobbeleer/oh-my-posh/main/themes/schema.json",
  "blocks": [
    {
      "type": "prompt",
      "alignment": "left",
      "segments": [
        {
          "type": "session",
          "style": "diamond",
          "leading_diamond": "\uE0B6",
          "foreground": "#ffffff",
          "background": "#3A86FF",
          "properties": {
            "prefix": "",
            "display_host": false
        }
        },
        {
          "type": "path",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#4e903d",
          "properties": {
            "prefix": " \uE5FF ",
            "style": "full"
          }
        },        
        {
          "type": "git",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#193549",
          "background": "#fffb38",
          "properties": {
            "display_stash_count": true,
            "display_upstream_icon": true
          }
        },
        {
          "type": "root",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#ff479c"
        },
        {
          "type": "time",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#33658A",
          "properties": {
            "prefix": " \u2665 ",
            "time_format": "15:04"
          }
        },
        {
          "type": "executiontime",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#8800dd",
          "properties": {
            "threshold": 500,
            "style": "austin",
            "prefix": " <#fefefe>\ufbab</> "
          }
        }        
      ]
    }
  ]
}

On a side note, throughout working the segments, I had the Blink-182 song Adam's Song in my head. So while I won't be keeping it, it turns out there's Spotify integration too...

Icons

Hit up Terminal-Icons to bring some extra colour and symbols into your Powershell. Note: these rely on Nerd Fonts from earlier in this post.

To install:

Install-Module -Name Terminal-Icons -Repository PSGallery

And add this to your $PROFILE

Import-Module -Name Terminal-Icons

The result looks like this:

Unfortunately, the .hbs files used by Handlebars aren't styled. Perhaps that would be a neat little pull request 👀 Edit: I did a PR for .hbs files and it was accepted, woo! https://github.com/devblackops/Terminal-Icons/pull/53

Visual Studio 2022

From a theme point of view, I'm going to be using the default (dark) everything. Though, compared to the VS2019 dark theme, there are a few differences in font (Consolas for 2019 and Cascadia Mono for 2022), accent colours and even the greys themselves.

To Conclude

What a fun evening that was, I've got a super jazzy environment now with all sorts of bells and whistles. Items to revisit in the future would be the Posh Git integration into Oh My Posh and effects on the terminal.

And I should go do that pull request for the .hbs files...
Future edit: I did: Contributing to Open Source: Terminal-Icons