FUNDAMENTALS A Complete Guide for Beginners
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.
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:
- 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.
- Application Development: VSCode is also used for application development, particularly for building cross-platform apps. Also, it provides extensions to ease software development.
- 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 |
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.
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:
- On the left-hand side of the VSCode window, click on the folder icon labeled Explorer.
- In the file explorer view, navigate to the directory where you prefer to locate your project.
- 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:
- Open the “Create New Project” dialogue.
- Depending on your programming language or framework, choose a template from the available template options.
- 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:
- Open your project in VSCode.
- Navigate to the Source Control View.
- 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:
- Initialize a new repository within your project directly in VSCode.
- View Git status in the Source Control View.
- 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.
- 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
- How to Install VSCode in Linux?
- How to Check VSCode version in Linux?
- How to Open VS Code from Terminal? [Quickest Solution]
- How to Duplicate a Line in VS Code? [4 Methods]
<< Go Back to Linux Text Editors | Learn Linux Basics