I'm not a slide-deck person. Yes, sometimes visuals are essential (still - in such cases, I prefer infinite whiteboards like Miro), but nothing beats presenting tech concepts/tools in action. Unfortunately, live-coding/live-demoing is very challenging because of the obvious reasons:
- adjustment of the level of detail
- getting stuck when difficulties happen (even a stupid typo you can't spot)
- some operations take more than a few seconds (which can kill the dynamics of the presentation)
- continuous switching of screens/windows/files means that your audience can quickly get pretty lost
Of course, that doesn't mean one should give up. You just have to be smarter, better prepared, and aid yourself with a couple of carefully selected tools. And those tools are exactly what I'd like to tell you about today. With a small disclaimer:
- I work on MBP (so I can't guarantee the same tools are available on other platforms as well)
- This toolset is not optimized for improvisation (e.g., coding manually from scratch) - that's why I won't mention any code completion mechanisms, etc. In my case, they'd just make the screen more cluttered.
- I'm not going to cover the absolute basics - text editors, fixed-width fonts, recording/streaming software.
- I'll (for the obvious reasons) skip all the tools that are ecosystem/tech stack-specific (e.g., CLIs, REPLs).
Terminal
That's probably one of the tools people pay the slightest attention to. Why so? The terminal is supposed to be fast and allow you to run any shell you prefer (bash, zsh, ...) plus eventually some wrapping around it (like oh-my-zsh). And that's about it.
Well, I kind of disagree.
My (by far) favorite terminal is called Warp (https://warp.dev), and it's far beyond what one could expect from a terminal app. It's block-based: you can edit your block (in terminal) like in a text editor, bookmark it, search within it, etc. It has a powerful auto-suggestion and clear visual cues (e.g., to distinguish commands that have ended with errors). Additionally, it's equipped with tons of tweaks that may appear tiny but make a hell of a difference altogether (example: 1-click copy of only the command's output - from a given block).
Screen space
A good terminal is essential, but sometimes you have to display a few windows/views simultaneously. Isn't it what we have tmux for? Well, yes and no. It's a great productivity tool, but it has some drawbacks: it can be pretty illegible to the audience, and it won't work with windows out of your terminal (like browser windows). That's bad.
But there are other tools that can be used for convenient screen space management. Personally, I use the one called Rectangle (https://rectangleapp.com/) - it's simple, unobtrusive, and its presets work for me (I don't need a fully-fledged tiling window manager).
Screen cues
While demoing in console, it's unrealistic to assume that your audience's focus should always be stuck on the cursor. Frequently you have to re-direct the attention to a particular region of the screen (word, line, widget). I used to do that by drawing lines, shapes, and arrows on the screen (with a mouse/touchpad) - however, it can be a bit messy (especially if a part of the screen gets scrolled up ...). Of course, you could use a laser pointer, but what if the demo happens over the Internet?
That's why I use a (paid) package called Screen Recording Toolkit (https://apps.apple.com/us/app-bundle/screen-recording-toolkit/id1585619344). It consists of 4 independent apps: cursor highlight (with an option of magnifying the area surrounding the cursor), keystroke display (so people know what shortcut I've used when something has changed), mirror magnet (adds the input from my camera as a small overlay, if your video streaming software can't do that or wastes too much screen space on that), and screensaver suspender.
Navigating around
Most tools I use daily are keyboard-friendly (even the visual ones, like the calendar) - I use a mouse as little as possible and only if necessary. However, memorizing all the keyboard shortcuts could be pretty challenging. I needed a better way to operate apps with a keyboard without the risk of forgetting important shortcuts in the middle of the demo.
Needless to say more - I needed a good launcher. I used Alfred for many years, but a few months ago, I switched to Raycast (https://www.raycast.com/). Primarily because of its vibrant plugin ecosystem. I had no difficulties finding plugins for all the essential tools I rely on.
General automation
OK, this category will be slightly different from the other ones. I'm still learning the tool, I already see its benefits, but I can't honestly say that I'm entirely sold at this point.
Smart automation is needed everywhere, all the time. There are certain actions (setting ENVs, switching SDK versions, changing sections in configuration files) that you need to execute each time you switch project, environment, or cloud region. Automating them can save you time, stress, and even more severe consequences.
Of course, you can do that with simple shell scripts, but at some point, organizing them may become an issue by itself. That's why Script Kit (https://www.scriptkit.com/) was born - it provides standard UI for your script execution and simplifies scripting the most frequent/generic scenarios. Like collecting user input, assigning keyboard shortcuts, adding searchable metadata (like description), or scheduling delayed execution.
The biggest drawback from my personal perspective is that this powerful tool supports only the scripts created in TypeScript. I don't find it a hard show-stopper, but I can't say I'm in love with that programming language ;)
Snippets
Snippets are essential for obvious reasons. In fact, >90% of what I put in the console (during a demo) is pasted snippets. Fortunately, there are plenty of tools one could use to manage fleets of snippets - Warp has "workflows", you can add snippets in Script Kit, and there's also a dedicated plugin for them in Raycast.
However, I prefer the snippet management in Dash (https://kapeli.com/dash) - a well-known offline documentation browser. It's simple, but it has exactly the functionality I need (e.g., parameterized snippets) - nothing more, nothing less - just the sweet spot.
Data formatting/viewing
Even Warp (with its blocks, visual cues, and search) won't save us if the CLI tool we run during our demo covers the whole screen (or more ...) with an amount of output non-comprehensible for the audience. When demoing (or rather - when preparing the demo up-front), you need to find a way to reduce the verbosity, so people see only what's essential (to understand what you're doing, to follow the flow of the demo, etc.).
We used to use sed or grep to do the text/content filtering (in the ol' good days ...), but modern CLI tools typically support structured input/output in the most popular formats - like JSON or YAML. There are better tools (than those mentioned) to tackle such formats - e.g., jq (for JSON - https://stedolan.github.io/jq/) or yq (for YAML - https://mikefarah.gitbook.io/yq/).
Mix them with bat (https://github.com/sharkdp/bat), and your output won't be just more concise but also syntax-colored for clarity.
Other
Dunno about you, but one of my least favorite activities during live-demoing is coping and pasting something on the screen. It's easy to select too little or too much content, and it takes precious seconds - the more you hurry, the more nervous you become.
That's why I use a lot of output filtering, piping, and clipboard interaction in the command line. How to do that? Fortunately, clipboard manipulation commands are built into macOS (pbcopy, pbpaste). And you can fine-tune your command pipelines (while preparing for the demo) with a nice little utility called Ultimate Plumber (https://github.com/akavel/up).
Last but not least - sometimes I need to measure and compare the performance of the stuff I run in a console. That does not sound like a big deal (date; stuff; date), but if you want to do that pro-way (multiple runs, mean calculation, etc.), you should befriend hyperfine (https://github.com/sharkdp/hyperfine).
Obviously, these are not all the tools I use, but probably the ones I use most (keeping in mind the constraints at the very top of this blog post). I hope you will find these recommendations helpful.
And what about you? Do you have any live-coding/live-demoing tools you could recommend to the community? Please don't hesitate to put them in the comments below.