My Developer Workbench
Overview
Today I'd like to share some of my developer workbench and the software I regularly use. I have broken them into a few categories:
- Essential Software
Software I regulary use.
- Implementation Software
Non-essential software that may be on my local development machine or installed in a dev container.
- VS Code Extensions
Extensions I use in VS Code.
Remember, my primary development machine is running OSX.
Essential Software
Software | Description |
---|---|
1Password | Password manager. Also setup to manage SSH keys. |
Alfred and PowerPack | Open apps, perform actions, and other workflows with hotkeys. |
asdf | Manage multiple versions of installed languages; such as Node.js, python, go, etc. |
Backblaze | Continuous backups with unlimited storage. |
bash | Preferred shell. |
BetterTouchTool | Customize aspects of your mac's trackpad, touch-bar, snap areas, and more. |
Cross Share with Alfred workflow | Airdrop via Alfred |
Discord | Chat application for personal dev communities and the React community. |
Docker | Running containers/devcontainers locally. |
git / GitHub CLI | Command-line access to GitHub specific functionality. |
Hazel | Automated file organization. |
Homebrew / Cask | Enables installing software from the command line. |
iTerm 2 | Stand-alone terminal supporting different visual styles. |
Karabiner Elements | Keyboard customizer. |
Lens | K8s IDE for managing K8s clusters. |
SnagIt | Capture screenshots or record your screen. Provides tooling to edit and markup images. |
Tailscale | Securely access your network from anywhere. |
VS Code | Primary editor. |
Implementation Software
Software | Description |
---|---|
Altair GraphQL Client | Postman-like client for GraphQL requests. |
ansible | Tool to help audomate IT and infrastructure. |
jq | Bash tool for parsing and manipulating JSON. |
jsonnet | Bash tool for generating JSON from a template. |
kubectl | Kubernetes management |
Proxmox | Bare-metal hypervisor I use at home to manage and virtualize environments/machines. |
terraform | Automate the provision of virtual machines on a variety of platforms/hypervisors. |
yq | Bash tool for parsing and manipulating YAML. |
VS Code Extensions
I created a simple bash script to pull these extensions from my VS Code installation. You can find it at the bottom of this page.
Assumes you have
jq
installed from the above list.
Extension Name | Description |
---|---|
1Password | Say goodbye to plaintext secrets in your code |
Elixir Test Explorer | Run Elixir tests in the Sidebar of Visual Studio Code |
Bookmarks | Mark lines and jump to them |
Jest Snippets | Jest snippets |
Apollo Workbench | Tooling to help you develop and mock federated schemas using Apollo Federation |
Apollo GraphQL | Rich editor support for GraphQL client and server development that seamlessly integrates with the Apollo platform |
ZipFS - a zip file system | Allows to easily inspect and modify files stored within zip archives. |
GitHub Markdown Preview | Changes VS Code's built-in markdown preview to match GitHub |
Markdown Checkboxes | Adds checkbox support to the built-in markdown preview |
Markdown Emoji | Adds emoji syntax support to VS Code's built-in markdown preview and markdown cells in notebook |
Markdown Footnotes | Adds [^footnote] syntax support to VS Code's built-in markdown preview |
Markdown Preview Mermaid Support | Adds Mermaid diagram and flowchart support to VS Code's builtin markdown preview |
Markdown Preview Github Styling | Changes VS Code's built-in markdown preview to match Github's style |
Markdown yaml Preamble | Renders yaml front matter as a table in the built-in markdown preview |
exports autocomplete | autocompletes javascript module exports from your project |
JS CodeFormer: Javascript Refactoring & Code Automation | A JavaScript/TypeScript refactoring and code automation tool for building better source |
JS Refactor :: JS CodeFormer | Automated refactoring tools to smooth your development workflow |
Jsonnet LSP | Jsonnet IDE Support. Autocomplete, lint, format, goto def, signature help. |
markdownlint | Markdown linting and style checking for Visual Studio Code |
ESLint | Integrates ESLint JavaScript into VS Code. |
EJS language support | 2019 - EJS language support for Visual Studio Code. |
null | null |
eslint-disable-snippets | Simple snippets to disable eslint rules |
GitLens — Git supercharged | Supercharge Git within VS Code — Visualize code authorship at a glance via Git blame annotations and CodeLens, seamlessly navigate and explore Git repositories, gain valuable insights via rich visualizations and powerful comparison commands, and so much more |
EditorConfig for VS Code | EditorConfig Support for Visual Studio Code |
Prettier - Code formatter | Code formatter using prettier |
shell-format | A formatter for shell scripts, Dockerfile, gitignore, dotenv, /etc/hosts, jvmoptions, and other file types |
HCL Format | format HCL (HashiCorp Configuration Language) |
GitHub Codespaces | Your instant dev environment |
GitHub Copilot | Your AI pair programmer |
GitHub Copilot Chat | AI chat features powered by Copilot |
GitHub Repositories | Remotely browse and edit any GitHub repository |
GitHub Actions | GitHub Actions workflows and runs for github.com hosted repositories in VS Code |
GitHub Pull Requests | Pull Request and Issue Provider for GitHub |
Jsonnet Language Server | Full code support (formatting, highlighting, navigation, debugging etc) for Jsonnet |
Excel Viewer | Edit Excel spreadsheets and CSV files in Visual Studio Code and VS Code for the Web. |
GraphQL: Language Feature Support | GraphQL LSP extension that adds autocompletion, validation, go to definition, hover, outline and more. |
GraphQL: Syntax Highlighting | Adds syntax highlighting support for .graphql & embedded support for javascript, typescript, vue, markdown, python, php, reason, ocaml and rescript |
HashiCorp Terraform | Syntax highlighting and autocompletion for Terraform |
Test Explorer UI | Run your tests in the Sidebar of Visual Studio Code |
Test Explorer Live Share | Use the Test Explorer in your Visual Studio Live Share sessions |
REST Client | REST Client for Visual Studio Code |
Flux | Flux language extension for VSCode |
ElixirLS: Elixir support and debugger | Elixir support with debugger, autocomplete, and more - Powered by ElixirLS. |
vscode-styled-sort | Opinionated rule sorting for styled-components. |
Presentation Mode | Show your code properly in a presentation |
Jest Test Explorer | Run your Jest tests in the Sidebar of Visual Studio Code |
Home Assistant Config Helper | Completion for entity-id's in Home Assistant Configurations |
SSH FS | File system, terminal and task provider using SSH |
CodeMetrics | Computes complexity in TypeScript / JavaScript files. |
DotENV | Support for dotenv file syntax |
File Downloader | Exposes an API that allows other extensions to download files. |
Azure Pipelines | Syntax highlighting, IntelliSense, and more for Azure Pipelines YAML |
Docker | Makes it easy to create, manage, and debug containerized applications. |
C# Dev Kit | Official C# extension from Microsoft |
C# | Base language support for C# |
.NET Install Tool | This extension installs and manages different versions of the .NET SDK and Runtime. |
IntelliCode for C# Dev Kit | AI-assisted development for C# Dev Kit |
Microsoft Edge Tools for VS Code | Use the Microsoft Edge Tools from within VS Code to see your site's runtime HTML structure, alter its layout, fix styling issues as well as see your site's network requests. |
autopep8 | Formatting support for Python files using the autopep8 formatter. |
Python Debugger | Python Debugger extension using debugpy. |
Python | Python language support with extension access points for IntelliSense (Pylance), Debugging (Python Debugger), linting, formatting, refactoring, unit tests, and more. |
Pylance | A performant, feature-rich language server for Python in VS Code |
Dev Containers | Open any folder or repository inside a Docker container and take advantage of Visual Studio Code's full feature set. |
Remote - SSH | Open any folder on a remote machine using SSH and take advantage of VS Code's full feature set. |
Remote - SSH: Editing Configuration Files | Edit SSH configuration files |
WSL | Open any folder in the Windows Subsystem for Linux (WSL) and take advantage of Visual Studio Code's full feature set. |
Remote Development | An extension pack that lets you open any folder in a container, on a remote machine, or in WSL and take advantage of VS Code's full feature set. |
Azure Account | A common Sign In and Subscription management extension for VS Code. |
Live Preview | Hosts a local server in your workspace for you to preview your webpages on. |
PowerShell | Develop PowerShell modules, commands and scripts in Visual Studio Code! |
Remote Explorer | View remote machines for SSH and Tunnels. |
Remote Repositories | Remotely browse and edit git repositories |
Remote - Tunnels | Connect to a remote machine through a Tunnel |
Test Adapter Converter | Converter extension from the Test Adapter UI to native VS Code testing |
Live Share | Real-time collaborative development from the comfort of your favorite tools. |
Nx Console | The UI for Nx & Lerna |
Jest | Use Facebook's Jest With Pleasure. |
CSS-in-JS | CSS-in-JS autocomplete and conversion |
Version Lens | Shows the latest version for each package using code lens |
Polacode | 📸 Polaroid for your code |
Prisma | Adds syntax highlighting, formatting, auto-completion, jump-to-definition and linting for .prisma files. |
Ansible | Ansible language support |
XML | XML Language Support by Red Hat |
YAML | YAML Language Support by Red Hat, with built-in Kubernetes syntax support |
Better Jinja | Syntax highlighting for jinja(2) including HTML, Markdown, YAML, Ruby and LaTeX templates |
JavaScript Booster | Boost your productivity with advanced JavaScript/TypeScript refactorings and commands |
Trx viewer | Allows visualizing .trx files. |
Auto Import | Automatically finds, parses and provides code actions and code completion for all available imports. Works with Typescript and TSX |
Code Spell Checker | Spelling checker for source code |
vscode-styled-components | Syntax highlighting for styled-components |
Even Better TOML | Fully-featured TOML support |
D2 | Support for .d2 files. |
MDX | Language support for MDX |
CodeTour | VS Code extension that allows you to record and playback guided tours of codebases, directly within the editor |
Import Cost | Display import/require package size in the editor |
MDX Preview | MDX Preview |
Markdown All in One | All you need to write Markdown (keyboard shortcuts, table of contents, auto preview and more) |
code --install-extension 1password.op-vscode
code --install-extension adamzapasnik.elixir-test-explorer
code --install-extension alefragnani.bookmarks
code --install-extension andrew-codes.jest-snippets
code --install-extension apollographql.apollo-workbench
code --install-extension apollographql.vscode-apollo
code --install-extension arcanis.vscode-zipfs
code --install-extension bierner.github-markdown-preview
code --install-extension bierner.markdown-checkbox
code --install-extension bierner.markdown-emoji
code --install-extension bierner.markdown-footnotes
code --install-extension bierner.markdown-mermaid
code --install-extension bierner.markdown-preview-github-styles
code --install-extension bierner.markdown-yaml-preamble
code --install-extension capaj.vscode-exports-autocomplete
code --install-extension cmstead.js-codeformer
code --install-extension cmstead.jsrefactor
code --install-extension cverge.jsonnet-lsp
code --install-extension davidanson.vscode-markdownlint
code --install-extension dbaeumer.vscode-eslint
code --install-extension digitalbrainstem.javascript-ejs-support
code --install-extension dracula-theme-pro.theme-dracula-pro
code --install-extension drknoxy.eslint-disable-snippets
code --install-extension eamodio.gitlens
code --install-extension editorconfig.editorconfig
code --install-extension esbenp.prettier-vscode
code --install-extension foxundermoon.shell-format
code --install-extension fredwangwang.vscode-hcl-format
code --install-extension github.codespaces
code --install-extension github.copilot
code --install-extension github.copilot-chat
code --install-extension github.remotehub
code --install-extension github.vscode-github-actions
code --install-extension github.vscode-pull-request-github
code --install-extension grafana.vscode-jsonnet
code --install-extension grapecity.gc-excelviewer
code --install-extension graphql.vscode-graphql
code --install-extension graphql.vscode-graphql-syntax
code --install-extension hashicorp.terraform
code --install-extension hbenl.vscode-test-explorer
code --install-extension hbenl.vscode-test-explorer-liveshare
code --install-extension humao.rest-client
code --install-extension influxdata.flux
code --install-extension jakebecker.elixir-ls
code --install-extension johnuphoff.vscode-styled-sort
code --install-extension jspolancor.presentationmode
code --install-extension kavod-io.vscode-jest-test-adapter
code --install-extension keesschollaart.vscode-home-assistant
code --install-extension kelvin.vscode-sshfs
code --install-extension kisstkondoros.vscode-codemetrics
code --install-extension mikestead.dotenv
code --install-extension mindaro-dev.file-downloader
code --install-extension ms-azure-devops.azure-pipelines
code --install-extension ms-azuretools.vscode-docker
code --install-extension ms-dotnettools.csdevkit
code --install-extension ms-dotnettools.csharp
code --install-extension ms-dotnettools.vscode-dotnet-runtime
code --install-extension ms-dotnettools.vscodeintellicode-csharp
code --install-extension ms-edgedevtools.vscode-edge-devtools
code --install-extension ms-python.autopep8
code --install-extension ms-python.debugpy
code --install-extension ms-python.python
code --install-extension ms-python.vscode-pylance
code --install-extension ms-vscode-remote.remote-containers
code --install-extension ms-vscode-remote.remote-ssh
code --install-extension ms-vscode-remote.remote-ssh-edit
code --install-extension ms-vscode-remote.remote-wsl
code --install-extension ms-vscode-remote.vscode-remote-extensionpack
code --install-extension ms-vscode.azure-account
code --install-extension ms-vscode.live-server
code --install-extension ms-vscode.powershell
code --install-extension ms-vscode.remote-explorer
code --install-extension ms-vscode.remote-repositories
code --install-extension ms-vscode.remote-server
code --install-extension ms-vscode.test-adapter-converter
code --install-extension ms-vsliveshare.vsliveshare
code --install-extension nrwl.angular-console
code --install-extension orta.vscode-jest
code --install-extension paulmolluzzo.convert-css-in-js
code --install-extension pflannery.vscode-versionlens
code --install-extension pnp.polacode
code --install-extension prisma.prisma
code --install-extension redhat.ansible
code --install-extension redhat.vscode-xml
code --install-extension redhat.vscode-yaml
code --install-extension samuelcolvin.jinjahtml
code --install-extension sburg.vscode-javascript-booster
code --install-extension scabana.trxviewer
code --install-extension steoates.autoimport
code --install-extension streetsidesoftware.code-spell-checker
code --install-extension styled-components.vscode-styled-components
code --install-extension tamasfe.even-better-toml
code --install-extension terrastruct.d2
code --install-extension unifiedjs.vscode-mdx
code --install-extension vsls-contrib.codetour
code --install-extension wix.vscode-import-cost
code --install-extension xyc.vscode-mdx-preview
code --install-extension yzhang.markdown-all-in-one
Bash Script
#! /bin/bash
markdown_list_output="|Extension Name | Description |
|:--|:--|"
markdown_install_output="\`\`\`bash"
readarray -t extensions <<<$(code --list-extensions)
for val in "${extensions[@]}"; do
extension_data=$(
curl \
-s \
--data "{\"assetTypes\":null,\"filters\":[{\"criteria\":[{\"filterType\":7,\"value\":\"$val\"}],\"direction\":2,\"pageSize\":100,\"pageNumber\":1,\"sortBy\":0,\"sortOrder\":0,\"pagingToken\":null}],\"flags\":2151}" \
--header "accept: application/json;api-version=3.0-preview.1" \
--header "content-type: application/json" \
https://marketplace.visualstudio.com/_apis/public/gallery/extensionquery
)
extensionName="$(echo "$extension_data" | jq '.results[0].extensions[0].extensionName')"
if [ extensionName == 'null' ]; then
continue
fi
markdown_list_output="$markdown_list_output
$(
echo "$extension_data" |
jq '"|[\(.results[0].extensions[0].displayName)](https://marketplace.visualstudio.com/items?itemName=\(.results[0].extensions[0].publisher.publisherName).\(.results[0].extensions[0].extensionName)) | \(.results[0].extensions[0].shortDescription) |"' |
sed 's/\"//g'
)"
markdown_install_output="$markdown_install_output
code --install-extension $val"
done
markdown_install_output="$markdown_install_output
\`\`\`"
echo "$markdown_list_output
$markdown_install_output"