My Favorite VSCode Shortcuts & Tricks of All Time

Hey friends, I recently ran a poll on Twitter asking which format you prefer for learning new skills: a 20-minute video tutorial or a blog post.

The results were evenly split, so I decided to create both! If you're here for the video version, check it out below.

And if you're coming from the video, welcome! This blog post serves as a cheat sheet for everything I've discussed in the video.

🌟 Level Zero: Absolute Beginner

At level zero, we're focusing on essential shortcuts that every programmer should master for a smooth coding experience. These shortcuts are not only applicable in VS Code but also in tools like Google Docs and Microsoft Word, making them universally useful.

• Creating a New File: Instead of relying on mouse clicks, use CTRL + N to create a new file swiftly.

• Selecting the Whole Document: Quickly select everything with CTRL + A.

• Mastering Text Selection:

  • To select character by character, use Shift + Left/Right Arrow.
  • For selecting a word at a time, Shift + CTRL + Left/Right Arrow will do the trick.
  • Selecting a whole line? Shift + Up/Down Arrow or Shift + FN + Left/Right Arrow for line selection without moving the cursor.

🚀 Level One: Building Skills

• Multi-Cursor Editing: ALT + Click or CTRL + ALT + Up/Down Arrow lets you edit multiple lines simultaneously.

• Viewing Suggestions: Forgot a Tailwind utility class? CTRL + Space brings up the suggestions.

• Renaming Attributes: Use CTRL + Shift + L to select all occurrences of a specific term for renaming, or CTRL + D for selecting the next instance.

• Jumping to a Function's Definition: Use F12 to navigate directly to the definition of a function or variable.

• Reopening a Closed Tab: Accidentally closed a tab? CTRL + Shift + T will bring it back.

💡 Level Two: Enhancing Workflow

• Commenting Code: Use CTRL + / or CTRL + K, CTRL + C to comment and CTRL + K, CTRL + U to uncomment.

• Collapsing Functions: CTRL + K, CTRL + 0 collapses all functions, while CTRL + K, CTRL + J unfolds them.

• Navigating Files and More:

  • CTRL + P for quick file access.
  • > for searching commands.
  • @ to search for symbols within the current file.
  • : followed by a line number to jump to a specific line.

🏆 Pro Level: Advanced Techniques

• Sticky Scroll: Keep your headers visible while scrolling through your code by enabling sticky scroll in the settings.

• Customizing Shortcuts: Modify your shortcuts in the Keyboard Shortcuts settings to suit your workflow.

• Sidebar Position: Consider moving your sidebar to the right for less layout shift and more focused coding.

That was a good decision!

Incorporating keyboard shortcuts into your workflow can significantly save time. I hope this guide enhances your efficiency in VS Code.

Share this with anyone who might find it beneficial and let me know your thoughts or any shortcuts you love in the video comments!

Happy coding! 🚀