Keyboard Shortcuts
The 20 keyboard shortcuts every developer uses daily — grouped by category with the exact keys, what each does, and when you will reach for it.
The difference between a slow developer and a fast one is not intelligence — it is friction. Every time you move your hand from the keyboard to the mouse to click a menu, find a file, or format code, you lose 2–3 seconds. Twenty times per hour, that is a minute an hour spent not writing code.
Keyboard shortcuts eliminate that friction. This page covers the 20 shortcuts you will use every day. Memorising all of them at once is not the goal. Instead, read through them once, recognise them when you see them, and come back to this page as a reference. Within two weeks of daily use, the important ones will be automatic.
The Excel parallel: You already know Ctrl+C, Ctrl+V, Ctrl+Z, Ctrl+S, Ctrl+F. Those are keyboard shortcuts — and you use them without thinking. VS Code shortcuts work the same way. The goal is to reach that same automatic state for developer-specific ones.
Navigation — Moving Around Your Project
These shortcuts are about finding and switching between files and locations. You will use these dozens of times per day.
| Shortcut | Action | When to use it |
|---|---|---|
| Ctrl+P | Open any file by typing its name | You know the filename but do not want to click through the sidebar. Type 2–3 characters and the file appears. Excel equivalent: Ctrl+G to go to a named range. |
| Ctrl+Shift+P | Command Palette — search all VS Code commands | You want to do something but don't know the shortcut. Type what you want in plain English. Every VS Code feature is searchable here. |
| Ctrl+Tab | Cycle through open file tabs | You have 5 files open and want to switch between them quickly. |
| Ctrl+` | Toggle the terminal panel | Open or close the terminal without touching the mouse. The backtick key is to the left of the 1 key on most keyboards. |
| Ctrl+B | Toggle the Sidebar | Hide the sidebar to gain more coding space. Press again to bring it back. |
| F12 | Go to Definition | Your cursor is on a function name or imported component. Press F12 — VS Code jumps to where that function is defined, even if it is in another file. |
| Alt+F12 | Peek Definition | Same as F12, but opens the definition in a small inline panel without navigating away from your current file. Useful when you want to check a function quickly. |
| Ctrl+Click | Follow a link | Hold Ctrl and click any import path or function name — VS Code follows it to the definition. Same result as F12 but triggered by click instead of keyboard. |
| Ctrl+G | Go to line number | Type a number and press Enter — your cursor jumps to that line. Useful when an error message says "line 47". |
Ctrl+P is the one to master first. A project can have 200+ files. Finding a file by clicking through the sidebar takes 10–15 seconds. Ctrl+P + 3 characters + Enter takes under 2 seconds. This single shortcut will save you 30+ minutes per week.
Ctrl+P now. Start typing the name of any file in your project. Confirm it appears in the dropdown. Press Enter to open it. Then press Ctrl+P again and type the first 3 letters of a different file. Switch between them using Ctrl+Tab.Editing — Writing and Manipulating Code
These shortcuts operate on the code you are writing. They cover the most common editing tasks without reaching for the mouse.
| Shortcut | Action | When to use it |
|---|---|---|
| Alt+Up / Alt+Down | Move the current line up or down | You wrote a line in the wrong order. Hold Alt, press Up or Down, and the line moves without cut-and-paste. |
| Ctrl+D | Select the next occurrence of the selected word | Select a variable name, press Ctrl+D — it selects the next place the same name appears. Press again for the one after that. Now edit all of them simultaneously. |
| Ctrl+Shift+L | Select ALL occurrences of the selected word | Like Ctrl+D but selects every instance in the file at once. Rename a variable everywhere in one step. |
| Ctrl+/ | Toggle line comment | Select one or multiple lines and press Ctrl+/. VS Code adds // at the start (commenting it out). Press again to uncomment. In JSX it uses {/* */} automatically. |
| Ctrl+Shift+K | Delete the entire current line | Faster than Home → Shift+End → Delete → Backspace. |
| Ctrl+Enter | Insert a new line below (without moving cursor to end of current line) | You want to add a line below the current one. Without this, you'd press End first to go to the end of the line, then Enter. Ctrl+Enter does it from anywhere on the line. |
| Alt+Shift+Down | Duplicate the current line below | You want to copy a line and make a minor change. This saves a Ctrl+C and Ctrl+V. |
| Ctrl+Z / Ctrl+Y | Undo / Redo | Identical to Excel — undo a change, or redo one you just undid. VS Code keeps a very long undo history. |
| Ctrl+Shift+[ / ] | Fold / Unfold code block | Collapse a function or block of code so you can focus on surrounding code. Useful for very long files. Click the small arrow on the line number gutter. |
Ctrl+D is particularly powerful for renaming. Select a variable name, then press Ctrl+D repeatedly to add each next occurrence to your selection. When all occurrences are selected, type the new name — all of them update simultaneously. This is the correct way to rename something in a file (for project-wide renaming, use F2 instead).
Ctrl+Shift+L selects ALL occurrences including inside strings and comments. If you are renaming a variable, check the results carefully — it will also select the name if it appears in a comment or a string literal, which may not be what you want. Use Ctrl+D instead to select occurrences one by one, skip the ones you do not want to change, and edit only the right ones.
Search — Finding Code
| Shortcut | Action | When to use it |
|---|---|---|
| Ctrl+F | Find within the current file | Search for any text in the file you are editing. Press Enter to jump to the next match, Shift+Enter for the previous. Escape to close. Excel equivalent: Ctrl+F. |
| Ctrl+H | Find and Replace in current file | Replace a word or phrase everywhere in the current file. Excel equivalent: Ctrl+H. |
| Ctrl+Shift+F | Search across ALL files in the project | Search every file in your project for a word or phrase. Results appear in the Search Sidebar showing file name, line number, and surrounding text. This is how you find which component uses a particular function or variable. |
| Ctrl+Shift+H | Find and Replace across ALL files | Replace a word or phrase in every file in the project simultaneously. Use with caution — preview the changes before confirming. |
Ctrl+Shift+H is powerful and irreversible in the moment. Before using Find and Replace across all files, make sure your changes are committed to Git. If the replacement goes wrong, you can use Git to revert all files to the pre-replacement state. If you have not committed, undoing 50 replacements across 30 files is painful.
Ctrl+Shift+F and search for a word you know exists somewhere in your project (like function or return). Confirm results appear showing the file name, line number, and surrounding text. Click any result to jump directly to that line.Terminal — Running Commands
| Shortcut | Action | When to use it |
|---|---|---|
| Ctrl+` | Toggle terminal panel | Open or close the terminal. You already know this one. |
| Ctrl+Shift+` | Create a new terminal | Open a second terminal session alongside the existing one. Use when the dev server is running in terminal 1 and you need to type other commands in terminal 2. |
| Up arrow (in terminal) | Previous command | Browse command history. Press Up repeatedly to scroll back through commands you have run. No need to retype long commands. |
| Ctrl+C (in terminal) | Stop the running process | When npm run dev is running and you want to stop it, press Ctrl+C. Works for any long-running process. |
Git and Source Control
| Shortcut | Action | When to use it |
|---|---|---|
| Ctrl+Shift+G | Open Source Control panel | Opens the Git panel in the Sidebar — shows changed files, staged files, commit box. |
Most Git actions in VS Code are done through the Source Control Sidebar panel, not keyboard shortcuts. Once the panel is open, use the + buttons to stage files and the checkmark to commit.
Other Useful Shortcuts
| Shortcut | Action | When to use it |
|---|---|---|
| Ctrl+Shift+V | Preview Markdown | When you have a .md or .mdx file open, this opens a rendered preview of it. See how the formatted document looks while you write it. |
| F2 | Rename Symbol | Place your cursor on a variable, function, or component name. Press F2, type the new name, press Enter. VS Code renames it everywhere in the project — not just the current file. Smarter than Ctrl+Shift+H because it understands code context. |
| Ctrl+. | Quick Fix | When your cursor is on an underlined error, this opens a menu of automatic fixes VS Code can apply. Often fixes missing imports, incorrect types, and similar common problems. |
| Shift+Alt+F | Format Document | Manually trigger Prettier formatting on the current file. Same as right-clicking and choosing "Format Document." Usually not needed if Format On Save is configured — but useful if you want to force a format without saving. |
The Shortcuts to Learn First (Priority Order)
Not all 20 shortcuts are equally important. Learn them in this order:
Week 1 — Start with these:
| Shortcut | Why first |
|---|---|
| Ctrl+S | Save (you already know this — just keep using it) |
| Ctrl+P | Find any file — used constantly |
| Ctrl+` | Open terminal — used for every command |
| Ctrl+Z / Ctrl+Y | Undo/redo — same as Excel |
| Ctrl+/ | Comment/uncomment — used when debugging |
Week 2 — Add these:
| Shortcut | Why second |
|---|---|
| Ctrl+Shift+P | Command palette — your escape hatch for anything you can't find |
| Ctrl+D | Select next occurrence — used when editing variable names |
| Ctrl+F / Ctrl+Shift+F | Find in file / find in project |
| Alt+Up / Alt+Down | Move line — used constantly when reorganising code |
| F12 | Go to definition — essential for understanding unfamiliar code |
Week 3 and beyond — These come naturally with use:
The remaining shortcuts will be adopted as you need them. When you find yourself doing something the slow way (clicking through menus, copying and pasting lines, manually searching files), that is the signal to look up whether there is a shortcut for it.
Customising Shortcuts
Every shortcut in VS Code is configurable. If a shortcut conflicts with something your muscle memory already knows, you can change it.
To view and edit shortcuts:
- Press Ctrl+Shift+P
- Type
"Open Keyboard Shortcuts" - Press Enter
The Keyboard Shortcuts panel shows every command with its current binding. Search for any command name, click the pencil icon, and press your new key combination.
For this training, use the defaults. Customisation is for after you have built familiarity with the standard layout.