Live coding on stage: making every keystroke visible to the room

27 October 2026 · 7 min read

To make live coding work for a room, make the code far bigger than feels natural, put the keys you press on screen so people see the shortcut and not only its effect, and keep secrets out of everything the projector shows. If you only ever code in VS Code, its built-in Screencast Mode shows your keys inside the editor window. If your talk moves between the editor, a terminal and a browser, a keyboard overlay such as Typebar shows them in every app and names each shortcut as you press it.

The rest of this post goes through the setup in the order you would do it: size, keys, secrets, rehearsal, and a way out when the demo breaks.

Make the code readable from the back row

Set up for the person in the last row. Text that looks huge on your laptop is ordinary on a projector screen, and the room cannot lean in.

Editor. In VS Code, View > Appearance > Zoom In, or Command-Equals (⌘=), enlarges everything, and Command-Minus (⌘-) goes back. Zoom enlarges the sidebar too, so hide it with Command-B while you code and bring it back when you need the file tree.
Terminal. In Terminal, View > Bigger, or Command-Plus (⌘+), makes the text larger, and View > Default Font Size (Command-0) puts it back.
The whole Mac. In System Settings > Displays, pick a resolution toward Larger Text. Menus, dialogs and the browser all grow with it, which helps when the demo leaves the editor.
Contrast. Projectors tend to wash out low-contrast themes. Pick an editor theme with strong contrast and check it on the real projector, not on your own screen.

Mirror your display rather than extending it, so you look at the same picture the room sees instead of turning round to check. In System Settings > Displays, select the projector and pick the mirror option from its “Use as” menu. Screen sharing to a big room: what to make bigger on your Mac goes further on sizing.

Show the keys, not just what they did

Live coding has a particular problem. You press Command-D (⌘D) in VS Code three times, three cursors appear, and you start typing in three places at once. The room sees the result and none of the cause. Anyone who wanted to learn the trick has to ask afterwards, and most will not.

VS Code’s Screencast Mode is a free fix inside the editor. Open the Command Palette with Command-Shift-P (⇧⌘P) and run Developer: Toggle Screencast Mode. VS Code then shows each key you press near the bottom of its window, adds the command name for shortcuts, and marks mouse clicks with a red circle. Its settings change the font size and position. Run the same command again to turn it off.

Its limit is the window. Switch to Terminal, a browser or the app you are building, and the keys stop, because Screencast Mode is part of VS Code and sees only what happens there.

A keyboard overlay works at the level of the Mac, so it carries on wherever you go. In Typebar:

The pill shows what you press as keycaps and names each shortcut with the name it has in the app you are using, taken from that app’s own menus. Typing gathers into one chip, so a line of code does not bury the shortcut you pressed before it, and a shortcut pressed again counts up as ×2, ×3.
Shortcuts only. The pill can show only shortcuts, with or without keys like Return and Tab, so ordinary typing stays off the screen and the shortcuts stand out.
The keyboard lights each key on an on-screen board. Show it when the audience is there to learn the shortcuts themselves; in a talk about an idea, the pill alone is usually enough.

Place it where the code is not. In an editor the bottom right is often empty, but in a full-screen terminal the line you type on sits at the bottom, so check both. Each mode keeps its own size and place, and you drag it by its handle. Control-Option-Command-K (⌃⌥⌘K) shows or hides it.

Keep secrets off the screen

A projected screen gets photographed, and talks get recorded and posted. Treat everything on it as public.

Load API keys and tokens into the environment before you go on stage, and do not open the file that holds them. A demo account with keys you revoke after the talk is safer still.
Turn on Do Not Disturb from Control Center, so a message preview does not land on top of your code. In System Settings > Notifications, make sure Allow notifications when mirroring or sharing the display is off.
Close browser tabs and terminal windows you do not need, and check your shell history for anything you would not want read aloud.

An overlay adds a new way to leak something, since it repeats what you type in large keycaps. Typebar has guards for that. When macOS marks a field as secure, as it does for password fields, nothing typed shows and the pill says “Typing hidden in a password field”. While 1Password, Bitwarden, Keychain Access or Passwords is in front, nothing typed shows, and you can add your own apps to that list. Hide letters, meant for live demos, keeps shortcuts and special keys visible but turns letters into dots. Pause, from the menu or a shortcut, stops everything until you resume.

None of this hides what you type from the editor or terminal itself. A token typed into a terminal is on screen in the terminal whatever the overlay does, so the habits above matter more.

One trap: Terminal, and some other terminals, have a Secure Keyboard Entry option in the app menu (in Terminal, Terminal > Secure Keyboard Entry). With it on, macOS keeps your typing away from other apps while that terminal is in front, key displays included, so the overlay goes quiet just as you start typing commands. Secure input on a Mac: why some apps go blank to key displays explains why.

Rehearse with the exact setup

Rehearse on the projector if you can get into the room early, and at the projector’s resolution if you cannot. Record a run-through with Command-Shift-5 (⇧⌘5) and Record Entire Screen, then watch it back the way the audience will: from a distance, without knowing what comes next. You will spot the shortcut you never named, the overlay sitting on a line of output, and the moment you typed faster than anyone could read.

Typebar keeps a whole setup in a profile: look, mode, sizes and places, pill, mouse and sounds. It comes with a Presenting profile. Adjust it during rehearsal and switch to it from the menu or a shortcut before you go on, so you are not dragging the board around in front of the room. One setup for recording, another for teaching covers profiles. Typing sounds are off until you turn them on; on stage, leave them off.

Two habits to rehearse along with the code:

Say the shortcut as you press it. The overlay shows it, but people are looking at the code, not the corner. “Command-D, three times” sends their eyes there.
Give the key that matters its own moment. Type the routine parts at normal speed, then press the shortcut you are teaching on its own, with a beat before and after.

Have a way out when the demo breaks

Something will go wrong eventually: the Wi-Fi, a dependency, your own typing under pressure. Plan the exit before you need it.

Commit each step. Keep the demo in git with a tag for each stage, so a broken step becomes one checkout and a sentence instead of five minutes of debugging in public.
Prepare the long parts. Nobody needs to watch you type thirty lines of boilerplate. Editor snippets work, and so do Typebar layers: hold a key you choose and the board shows keys that type a snippet, open an app or send a shortcut. Tell the room the code was prepared.
Work offline. Install dependencies before the talk and run the whole demo once with Wi-Fi turned off.
Keep a recording. Record the demo working, with the keys showing, and have it ready to play. If the live version fails, the room still sees the idea.

Questions

Does VS Code show keystrokes on its own?

Yes. Developer: Toggle Screencast Mode in the Command Palette shows keys, shortcut names and clicks, but only inside the VS Code window.

Will the overlay show on the projector?

If you mirror your display, yes. The room sees your whole screen, and the overlay is on it like any other window.

Can the audience see a password I type?

Not in the overlay, when the field is marked secure or a password manager on the list is in front. Better still, use Touch ID or your password manager on stage, so there is nothing to type.

Typebar is $9 once for up to five Macs, free for 24 hours with everything on, and runs on macOS 14 Sonoma or later.