VSCode in Linux

LINUX
FUNDAMENTALS
A Complete Guide for Beginners Enroll Course Now

Visual Studio Code (VSCode) is a leading and renowned code editor in Linux for its versatility, efficiency, and extensive feature set. Its seamless integration with Linux systems creates a dynamic platform that empowers developers to create robust solutions efficiently. This article aims to harness the full potential of Visual Studio Code on Linux from scratch.

What is VSCode?

Visual Studio Code (VSCode) is a free, open-source text editor or IDE developed for Windows, Linux, and macOS that offers debugging, syntax highlighting, code refactoring tools, snippets, automatic code completion, embedded Git control, etc. As an open-source tool, it offers an abundance of extensions and acts as a version control system.VS Code editor in linux

What is VSCode used for?

Visual Studio Code (VSCode) is a versatile and powerful source-code editor primarily used for software development. Here are some of the key uses of VSCode:

  1. Web Development: VSCode grabs the attention of web developers for building websites and web applications. It offers built-in support for HTML, CSS, and JavaScript, along with extensions for popular web development frameworks.
  2. Application Development: VSCode is also used for application development, particularly for building cross-platform apps. Also, it provides extensions to ease software development.
  3. DevOps and Automation: VSCode is used for DevOps tasks such as writing automation scripts, managing infrastructure as code, and working with configuration files like YAML and JSON.

Features of VSCode

The key features of  VSCode are listed below:

  • Writing Code: VSCode provides a user-friendly environment for writing and editing code in various programming languages such as Python, Javascript, Java, C++, and many more.
  • Debugging: VSCode has built-in debugging tools that enable developers to identify and fix issues in the written code efficiently. The debugging features include breakpoints, watch variables, and stepping through code execution.
  • Syntax highlighting: VSCode highlights the color and style of the source code of the editor which makes it easier for developers to read and understand their code.
  • Automatic Code Completion: VSCode suggests completions for code snippets, function names, and variable names as you type, helping to speed up coding and reduce errors.
  • Version Control integration: VSCode seamlessly integrates with version control systems like Git, allowing developers to manage code repositories, track changes, and collaborate with team members effectively.
  • Task Automation: VSCode supports task automation through its built-in task runner and integration with build tools like Grunt, Gulp, and npm scripts. This enables developers to automate repetitive tasks and streamline their development workflow.

VS Code Extensions

VSCode comes with various extensions that enhance its functionality and support a broad range of languages, frameworks, and development workflows. Here’s a curated list of 10 popular and useful VSCode extensions:

VSCode Extensions Functions
Visual Studio IntelliCode Auto-complete code with the assistance of AI’s suggestions.
GitLens Supercharges VSCode’s Git capabilities and lets you go through who, what, and how a line of code has changed in the past.
ESTLint Provides JavaScript lint and code formatting in real-time for TypeScript and JavaScript projects.
Prettier Automatically formats your code according to pre-defined rules.
Bookmarks Helps to navigate within your code, mark or unmark positions within code, and jump back and forth between bookmarks by creating bookmarks.
Code Spell Checker Fixes the common spelling errors in the code and comments.
Codium AI Generates test code, enhances code review behavior, and improves code coverage suggestions within the IDE or Git platform.
Error Lens A debugging tool that excels diagnostic features by highlighting the entire line wherever a diagnostic is generated.
Peacock Manages multiple VS Code instances, utilizing VS Live Share, or leveraging VS Code’s REmote features.
TODO Highlight Highlight the TODOs you’ve added while coding to remind you of the task.

How to Search, Install, and Use VS Code Extensions?

Searching, installing, and using extensions in VSCode is straightforward and can greatly enhance your coding experience.

Searching for Extensions

To search for an extension, open the VSCode and click on the Extensions view icon of the Activity Bar on the side or press CTRL+SHIFT+X. Once in the Extension view, you’ll find a search bar at the top. Here, type the keywords related to the extension you are looking for and press ENTER. Finally, browse through the search results to find the extension you want.

Installing Extensions

After you’ve located the desired extension in VSCode, click on it to view the detailed information about the extension’s features, compatibility, ratings, and reviews. At your convenience, click on the Install button. Once the installation is complete, you may have to reload VSCode to activate the newly installed extension.

Using Installed Extensions

After installing the extension, you may be required to reload your VSCode to activate it. If it prompted, click on the Reload button. While many extensions get activated to the editor immediately after installation like the Python extension, some may require manual activation. If the functionality isn’t added automatically, to access extension commands, use the VSCode command palette CTRL+SHIFT+P and search for the extension name or related keyword.

Updating  Extensions

VSCode automatically checks for updates to installed extensions and prompts you to update them. To update VSCode extensions manually, you can check the updates by clicking on the Update All button.

Uninstalling Extensions

To uninstall an extension, click on the Manage gear icon next to the extension entry, and then select Uninstall from the drop-down menu. This is how the extension will be removed and ask you to reload the VSCode.

Keyboard Shortcuts for VSCode in Linux

Type of Shortcut Shortcut Key Action
General Shortcuts CTRL+ SHIFT+ P Open Command Palette
CTRL + SHIFT + N New window
CTRL+ SHIFT+W Close Current Tab
CTRL+SHIFT+T Reopen Closed Tab
CTRL + S Save
CTRL+SHIFT+S Save as
CTRL+B Toggle Sidebar
CTRL+F Find
CTRL+H Find and Replace
F11 Toggle Full Screen
CTRL+SHIFT+N Create a new window.
Editing Shortcuts CTRL+C Copy
CTRL+X Cut
CTRL+V Paste
CTRL+Z Undo
CTRL+SHIFT+Z Redo
CTRL+A Select All
CTRL+G Go to Line
ALT + ↑ Move Line Up
ALT + ↓ Move Line Down
Navigation Shortcuts F12 Go to definition
CTRL+F12 Go to declaration
CTRL + P Go to File
CTRL+G Go to Line
Debugging Shortcuts F5 Start Debugging
CTRL+F5 Start without debugging
SHIFT+F5 Close debugging
F10 Step over
F11 Step into
SHIFT+F11 Step out
Terminal Shortcuts CTRL+SHIFT+ Create new terminal
CTRL+L cLEAR TERMINAL
CTRL+SHIFT+C Copy selection in Terminal
CTRL+SHIFT+V Pate into Terminal
Version Control Shortcuts CTRL+SHIFT+G Open source control view
CTRL+ENTER Commit changes
CTRL+SHIFT+ENTER Push changes
CTRL+SHIFT+P and type “pull” Pull changes
Note: To find more useful shortcuts, check this cheat sheet of VSCode.

Installation of VSCode in Linux

There are a couple of approaches to installing VSCode in Linux such as using package managers, using universal package manager (snap), or manual installation. The installation method of VSCode in Linux depends on the distribution being used due to the different package managers of each.

For convenience,  you can use the Snap package manager which works across various Linux distributions and offers easy installation. To install VSCode in Linux via snap, run the following command in the terminal:

sudo snap install --classic code

Make sure you have Snap installed in your system.

Note:  If you don’t have Snap installed in your system (any distribution of Linux), check this installation guide as you need.

Guide to Use VSCode in Linux

Here’s a guide to get you started using VSCode in Linux:

Launching VS Code

Once you’ve installed VSCode in your Linux, you must launch it by searching for it in your system’s application menu. Alternatively, you can also launch it from the terminal by running the following command:

code

Opening Projects

To open projects in VSCode, follow the steps below:

  1. On the left-hand side of the VSCode window, click on the folder icon labeled Explorer.
  2. In the file explorer view, navigate to the directory where you prefer to locate your project.
  3. Once you’ve located your project directory, right-click on the project directory and select “Open in New Window” to open the project in a new window.

Creating Projects in VSCode

To create a project in VSCode, check the following steps:

  1. Open the “Create New Project” dialogue.
  2. Depending on your programming language or framework, choose a template from the available template options.
  3. After selecting the project template, you’ll be prompted by a window to provide additional information for your new project. This includes project name, location, dependencies, and other specific things. After providing the information click on Create.

Initialize a Repository

Follow the steps below to initialize a repository in VSCode:

  1. Open your project in VSCode.
  2. Navigate to the Source Control View.
  3. Click the Initialize Repository button to set up a new git repository within your project directory.

Git Integration in VSCode

To integrate Git in VSCode, you need to have Git installed in your system. Here is a guide to get started:

  1. Initialize a new repository within your project directly in VSCode.
  2. View Git status in the Source Control View.
  3. You can stage individual lines of code or entire files using the contextual menu (right-click on a file) or the source control view icons.
  4. Once you’ve staged your changes, add a description to your commit message and save your commit to your local Git.

Limitations of VSCode in Linux

Though VSCode is a powerful tool, it still has a few limitations to consider:

  • Limited Native Integration: Features like code completion or debugging require installing extensions in VSCode which adds complexity and potential compatibility issues.
  • Manual Updates: The delay between official VSCode releases and when those updates become available through distro package managers leads to the overall delay in distro package updates.
  • Potentially heavier weight: Due to the heavier weight of the VSCode compared to the other Linux editors, performance may get slower with limited RAM.
  • Extension compatibility issues: Some extensions may not be compatible with the Linux version of VSCode which leads to fewer features compared to the Windows or Mac.

Conclusion

In conclusion, VSCode is a powerful and versatile code editor for developers in Linux which offers a feature-rich and highly customizable coding environment. By exploring its key features and extensive extensions, you can unleash the full potential of the VSCode for Linux-based development. Hope this article expands your knowledge of VSCode and elevates your Linux development experience to new heights.

People Also Ask

Is VSCode a text editor?

Yes, undoubtedly VSCode is the most versatile text editor that provides developers with a flexible and efficient coding environment. It offers a plethora of valuable tools and extensions designed to simplify and enhance the developer experience, making their work more comfortable and convenient.

Which is the fastest Linux distribution for VSCode?

The fastest Linux distribution for VSCode depends on various factors like hardware specifications, system configuration, and preferences. Several distributions stand out for their lightweight nature and optimized performance like Arch Linux which offers minimalism, simplicity, and customizability whereas Alpline Linux focuses on security and efficiency in resource-constrained environments.

What is a workspace in VSCode?

In VSCode, “Workspace” is the collection of folders you open to work on your project. It can be either a single folder or multiple-root workspace. The most common scenario is when you open a project in VSCode, that folder becomes your workspace. Multi-root workspace is the advanced feature of VSCode where you work in multiple folders simultaneously within a single VSCode window.

VSCode or Visual Studio?

Choose VSCode for a lightweight, versatile code editor with extensive and rich extensions. On the other hand, opt for Visual Studio if you prefer a comprehensive integrated development environment (IDE) with advanced features and tools for complex projects like the .NET ecosystem.

How to view Git status in VSCode?

To view Git status in VSCode, navigate to the Source Control View where you can see the state of your files in different colors. In Green, you can see unstaged changes. In Blue, you can see staged changes.  And in Gray, you can see untracked changes (new files that haven’t yet been committed to Git).

Related Articles


<< Go Back to Linux Text Editors | Learn Linux Basics

5/5 - (2 votes)
Auhona Islam

Auhona Islam is a dedicated professional with a background in Electronics and Communication Engineering (ECE) from Khulna University of Engineering & Technology. Graduating in 2023, Auhona is currently excelling in her role as a Linux content developer executive at SOFTEKO to provide a more straightforward route for Linux users. She aims to generate compelling materials for Linux users with her knowledge and skills. She holds her enthusiasm in the realm of Machine Learning (ML), Deep Learning (DL), and Artificial Intelligence (AI). Apart from these, she has a passion for playing instruments and singing. Read Full Bio

Leave a Comment