Issue #109  (Folding Code Regions)05/22/24

Advertisement
Techpresso: Get Smarter About AI and Tech in 5 mins

Receive a daily summary of the most important AI and Tech news, carefully selected from 60+ media outlets.

Techpresso

Also includes a good dose of tech tools and programming-related apps and resources. Join 30,000+ professionals from OpenAI, Meta, Google, Microsoft, Hugging Face, JP Morgan, and more.


When working inside your editor in VS Code, it may be convenient to be able to fold and unfold sections of code quickly, without needing to go through many menu options.

VS Code has shortcuts that allow you to quickly fold and unfold code regions. This means things like functions, classes, if statements, etc., can be collapsed and expanded. Basically just about any portion of code that has a nested section.

For example, if your cursor is inside a function, you can use the shortcut CTRL/CMD + SHIFT + [ to instantly collapse (or fold) that region of code. To expand (or unfold) that same region (assuming your cursor is still there) simply use CTRL/CMD + SHIFT + ].
 
Folding/Unfolding Regions in VS Code

If necessary, you can also fold every foldable region of code in the current file. This is done using the combo keyboard shortcut CTRL/CMD + K followed by CTRL/CMD + 0. To unfold all regions, use CTRL/CMD + K followed by CTRL/CMD + J.
 
Folding/Unfolding all regions in VS Code

You can also do some fine-grained folding/unfolding of code regions using the following shortcuts:
  • Fold a specific level of code (depending on nested regions): CTRL/CMD + K followed by CTRL/CMD + 3 (or whatever level you want to fold, from 1 to 7)
  • Fold all regions excepted the selected section of code: CTRL/CMD + K followed by CTRL/CMD + -
  • Unfold all regions excepted selected: CTRL/CMD + K followed by CTRL/CMD + =
  • Fold all block comments: CTRL/CMD + K followed by CTRL/CMD + /
If you forget any of these, just open your keyboard shortcuts list (CTRL + K followed by CTRL + S) then search for "folded" or "unfolded" to see all the current shortcuts available for your system.
 
As you might know, I write three different tech newsletters, among other projects. I'm a one-man operation and it's getting harder to find viable advertising to keep things going.

If you'd like to help support me, please check out my GitHub Sponsors page or make a one-time donation via PayPal.

$1 per month from about 10% of my readers is basically all I need!

Now on to this week's hand-picked links!
 

VS Code Tools

SharePoint Framework Toolkit — A VS Code extension that aims to boost your productivity in developing and managing SharePoint Framework solutions, helping at every stage of your development flow.

VSCode Dimmer Block — A VS Code extension that allows you to dim text outside of the current block by reducing the opacity of the text. Useful for better focus or possibly for recording presentations and screencasts.

The Complete JavaScript Course 2024 — An up-to-date course consisting of 68+ hours of HD video, looking at both modern and classic JavaScript features, while walking you through how to build 6 beautiful real-world projects.   Sponsor 

Git Blame — A popular VS Code extension that lets you see Git Blame information in the status bar for the currently selected line, among other Git-related features.

VS Code Theme of the Week

City Lights — A dark color theme designed with focus in mind and boasts "many custom made visual aids to help you code faster and more accurate", with support for many popular coding languages.

Aimless Theme for VS Code

This one is definitely a theme that needs a good bold font. I find that the screenshots on the extension page don't do the colors justice. You can see how much more attractive the theme is with the font I'm using (which is Fira Code Medium).
 

VS Code Articles

Tutorial: Install VS Code on a Cloud Provider VM and Set Up Remote Access — From the GitLab team, detailed instructions on how to automate the installation of VS Code on a VM running on a cloud provider and how to access it from your local laptop. 

Neovim to VS Code — Front-end developer Diana MacDonald shares her experience switching from Neovim to VS Code, which she sums up as 'a Vim power user’s guide to getting started with VS Code'.

The Morning Paper for Tech — Want a byte-sized version of Hacker News that takes just a few minutes to read? Try TLDR's free daily newsletter. It covers the most interesting tech, startup, and programming stories in just 5 minutes. No sports and no politics.  Sponsor 

My Web Development VS Code Settings, Theme, Extensions, Tips and Tricks — A popular post on dev.to from 2019 that you might find useful, though I'd say most of this would be well-known to most experienced VS Code users.

Best of the Rest

Tine — A simple text/code editor built in C, to keep the focus on the text editing and not be distracted too much by buttons, tabs, menus, and animations.

FullStacked Editor — Build and run full-stack JavaScript web apps on iOS, iPadOS, MacOS, Windows, Linux, with Android and Docker in the works.

Anytime Mailbox — Business starters, are you in need of a business address separate from your home? Anytime Mailbox provides a seamless solution, securing a private, professional address with added benefits like mail forwarding and scanning for ultimate convenience. Start browsing locations today.   Sponsor 

LazyVim for Ambitious Developers — A course that's approachable, digestible, and comprehensive, written for developers who want to ramp up on modal editing with Neovim.

Suggestions?

If you have any link suggestions, including a tool, article, or other resources related to VS Code or another IDE, send it via DM on X: @LouisLazaris or just hit reply on this email.

That's it for this issue.

Happy VS Coding!
Louis
VSCode.Email
@LouisLazaris
Copyright © VSCode.Email. All rights reserved.

Not affiliated with Microsoft, Visual Studio Code, or any of its trademarks.