Live Share
Live Share is VS Code’s real-time collaboration extension: share your workspace, terminal, debugger, ports, and editor cursors with anyone who has VS Code. It’s pair programming without context-switching to a screen-share — tighter feedback, faster reviews, lower bandwidth.
Install, share, security, patterns
EXAMPLE
// 1) Install
// VS Code → Extensions → search 'Live Share' → install official Microsoft extension
// (Pack also includes Live Share Audio for built-in voice)
//
// Code editor must be:
// • VS Code (Windows/Mac/Linux/web)
// • VS Code Insiders
// • Visual Studio (limited)
//
// First use: sign in with GitHub or Microsoft account
// 2) Start a session
// • Command Palette → 'Live Share: Start Collaboration Session'
// • Or click the 'Live Share' button in the status bar
// • Link copied to clipboard automatically
// • Share the link via Slack / Teams / email
//
// Optional: 'Live Share: Start Read-Only Session' — guests can only view
// 3) Join a session
// • Open the URL in browser → opens VS Code
// • Or: 'Live Share: Join Collaboration Session' → paste URL
// • Or: Live Share panel → 'Join Session'
//
// Guest sees:
// • The host's workspace files (read-only or edit, based on host setting)
// • Host's terminals (if shared)
// • Forwarded ports (e.g. localhost:3000)
// • Debug sessions (can step alongside)
// 4) What gets shared
// Files: Yes — guest sees the workspace tree
// Editor: Yes — cursors, selections, edits in real time
// Terminals: Optional — host explicitly shares
// Servers: Optional — host shares specific localhost ports
// Debug: Optional — both can step, set breakpoints
// Voice/chat: Built-in audio + comments
//
// What is NOT shared:
// • Host's settings.json
// • Host's installed extensions
// • Host's Git credentials
// • Files outside the workspace
// 5) Sharing a terminal — host
// • Live Share panel → 'Share Terminal'
// • Choose 'read-only' or 'read/write'
// • Guest sees the terminal in their VS Code
// • All keystrokes go to the host's machine (or shared if read/write)
//
// CAREFUL: a guest with write access to your terminal can run ANY command.
// 6) Forwarding ports
// Host runs npm run dev on localhost:3000
// • Live Share panel → 'Share Server' → enter 3000
// • Guest opens http://localhost:3000 → traffic tunnelled through Live Share
//
// Useful for:
// • Demoing a local-only feature
// • Letting the guest test your dev server
// • Sharing a Storybook / preview without deploying
// 7) Multi-cursor + follow mode
// • Click guest avatar in the editor → 'Follow' to track their cursor / open file
// • Edit anywhere; conflicts resolved like Google Docs (operational transform)
// • Press Ctrl+Alt+J / Cmd+Shift+J to focus the session participants list
// 8) Audio + chat
// • Live Share Audio extension adds built-in voice — no Zoom needed
// • Comments: 'Comments' panel works on shared files
// • For richer chat, pair with Slack / Discord
// 9) Pair programming patterns
// • Driver / Navigator — host drives, guest reviews + suggests; rotate every 25 min
// • Mob programming — 3+ devs; one keyboard, others suggest; rotate frequently
// • Code review walkthrough — author drives; reviewer follows + asks questions
// • Debugging sessions — share repro steps; both step through the bug
// • Onboarding — new dev follows a senior through codebase tour
// • Live interviews — candidate solves problems with shared workspace
// 10) Security checklist
// • Live Share guests get access to YOUR workspace files (when not read-only)
// • Don't share workspaces with secrets/.env unless you trust the guest
// • Use 'Stop Collaboration Session' when done; don't leave running
// • Audit shared terminals — write access = full shell access
// • For external collaborators, use READ-ONLY sessions by default
// • Anonymous guests: disable in settings ('liveshare.guestApprovalRequired')
//
// Workspace settings:
{
"liveshare.guestApprovalRequired": true, // approve each guest
"liveshare.allowGuestDebugControl": false, // forbid guests from controlling debugger
"liveshare.allowGuestTaskControl": false, // forbid running tasks
"liveshare.featureSet": "stable",
"liveshare.notebooks.allowGuestExecuteCells": false
}
// 11) Settings — host vs guest
// Host: // dictates session capabilities
// • Read-only by default
// • Approve each join request
// • Disable terminal / debugger access for guests
// Guest: // limited control
// • Can ask to share their terminal back (rare)
// • Use 'Focus' mode to stop following someone
// 12) Workspace setup that helps Live Share
// • Commit .vscode/settings.json + recommended extensions for consistent formatting
// • Pre-install dev container (so the guest doesn't have to)
// • Document 'first run' steps so the guest doesn't ask 'where do I click'
// 13) Alternatives to Live Share
// • Screen share (Zoom, Slack, Teams) — simple, lossy, one driver only
// • Tmate (terminal-only) — share a shell session via SSH
// • CodeWith Me (JetBrains) — IDE equivalent for IntelliJ family
// • GitPod / Codespaces — shared cloud dev environments; persistent state
// • Gather / Tuple — pair-programming-focused; less code-editor integration
// 14) Real-world tips
// • Live Share works best when both have similar specs (latency matters)
// • Network issues → session disconnects; reconnect, lose nothing
// • Use audio (built-in or Zoom) for tone + back-channel
// • Keep sessions to 60-90 min — fatigue hits fast
// • Take screenshots / notes during the session; you'll forget by tomorrow
// • For long-distance teams, schedule with calendar holds
// 15) Common bugs
// • Guest can't see a file — host accidentally added it to .gitignore or .vscode/settings excludes it
// • Forwarded port not reachable — host's localhost binding doesn't include 0.0.0.0 (set in dev server)
// • Audio choppy — disable browser tabs that hog CPU; use VS Code desktop
// • Edits lag during big paste — let it settle; conflicts resolve eventually
// • Sign-in fails — try GitHub instead of Microsoft account
// • Firewall blocking — Live Share uses outbound TCP 443; corporate proxies may block
// • Guest crashes don't affect host — but unsaved guest changes can vanish on reconnect
// • Settings.json local-only — guests don't get host's keybindings or theme
// • Treating it like screen share — Live Share allows EDITS; pair-programmer needs to communicate clearly
Why it matters
Live Share replaces screen-shares with real collaborative coding: editors, terminals, ports, debugger. Default to read-only sessions for external collaborators, disable terminal write access by default, end sessions explicitly when done, and pair with built-in audio or your usual voice tool for low-friction pair programming.
Tip: Tweak the snippet with Try it Yourself », then sit the quiz at the bottom of the page.
Example
Example
// Real-time collaborative editing + shared terminal + shared debugger. // Invite via a link, host stays in control.Try it Yourself »
Discussion
Loading…