Skip to content

1.6. VS Code

What is VS Code?

Visual Studio Code (VS Code) is a versatile and free open-source code editor developed by Microsoft. Known for its efficiency and adaptability, it supports a multitude of programming languages with built-in support for JavaScript, TypeScript, and Node.js. It's celebrated for its extensibility, allowing users to install extensions for additional languages, frameworks, and tools, making it a highly customizable environment for software development.

Why should you use VS Code?

VS Code stands out as a top choice for developers due to its:

  • Lightweight Performance: Offers robust features like IntelliSense for code completion, code navigation, and real-time syntax highlighting without bogging down your system.
  • Extensibility: Its extension marketplace provides support for almost all major programming languages and tools.
  • Integrated Terminal: Allows you to run shell commands, Git operations, and scripts from within the editor.
  • Debugging Tools: Comes with built-in debugging support for several languages and the capability to add more via extensions.
  • Source Control Integration: Features integrated Git support and extensions for other version control systems, enhancing code management.

How should you install VS Code?

To get started with VS Code:

  1. Go to the Visual Studio Code website.
  2. Download the installer for your operating system (Windows, macOS, or Linux).
  3. Execute the installer and follow the prompts to complete the installation.

Where can you learn how to use VS Code?

There are plenty of resources to help you master VS Code:

  • Official Documentation: A thorough guide covering everything from basic to advanced features.
  • VS Code Tips and Tricks: Enhance your productivity with these best practices and shortcuts.
  • Microsoft Learn: Offers free, interactive tutorials for using VS Code in various scenarios.
  • YouTube Channels: Search for VS Code tutorials on YouTube to find numerous guides for all skill levels.

Which VS Code extensions should you install for MLOps?

This section lists the extensions you can install from VS Code Marketplace:

A Tier: The Must

B Tier: The Great

C Tier: The Good

How can you configure VS Code settings for MLOps?

You can find below some settings for configuring VS Code. Each setting is annotated to help you understand what is does. Keep in mind that you can hover your cursor over a setting key in VS Code to access more information about that setting. You can also switch between the textual and visual interface using the “Go to document” icon at the top left of the editor settings.

{
    // enable Code Spell Checker by default
    "cSpell.enabled": true,
    // limit Code Spell Checker to markdown files
    "cSpell.enabledLanguageIds": [
        "markdown"
    ],
    // use en-US language by default for Code Spell Checker
    "cSpell.language": "en-US",
    // don't accept completion on enter
    "editor.acceptSuggestionOnEnter": "off",
    // don't let the cursor blink (distracting)
    "editor.cursorBlinking": "solid",
    // smooth caret for smooth editing :)
    "editor.cursorSmoothCaretAnimation": "on",
    // always let 15 lines as a margin when you scroll
    "editor.cursorSurroundingLines": 15,
    // use Fira code as the main font (support ligatures)
    "editor.fontFamily": "'Fira Code', monospace",
    // enable programming ligature (e.g., replace -> by →)
    "editor.fontLigatures": true,
    // default font size, use something comfortable for your eyes!
    "editor.fontSize": 14,
    // format the code you copy-paste in your editor
    "editor.formatOnPaste": true,
    // show the completion next to your cursor
    "editor.inlineSuggest.enabled": true,
    // disable the minimap on the right (distracting)
    "editor.minimap.enabled": false,
    // disable highlighting the word under the cursor (distracting)
    "editor.occurrencesHighlight": false,
    // don't highlight the current line (distracting)
    "editor.renderLineHighlight": "none",
    // smooth scrolling for smooth developments :)
    "editor.smoothScrolling": true,
    // required to use IntelliSense suggestions
    "editor.suggestSelection": "first",
    // enable tab completion (complete code by pressing tab)
    "editor.tabCompletion": "on",
    // if the line is longer than your window, display it on several lines
    "editor.wordWrap": "on",
    // don't automatically select files in explorer when you open them
    "explorer.autoReveal": false,
    // don't ask for confirmation when you delete a file
    "explorer.confirmDelete": false,
    // don't ask for confirmation when you drag and drop a file
    "explorer.confirmDragAndDrop": false,
    // save your file before switching to another one
    "files.autoSave": "onFocusChange",
    // set Python as the default language for new files
    "files.defaultLanguage": "python",
    // always have an empty line at the end of the file
    "files.insertFinalNewline": true,
    // use VS Code file explorer instead of the operating system
    "files.simpleDialog.enable": true,
    // remove whitespaces at the end of each line
    "files.trimTrailingWhitespace": true,
    // automatically fetch repository changes from GitHub
    "git.autofetch": true,
    // don't ask for confirmation before synchronizing git repositories
    "git.confirmSync": false,
    // commit all unstaged files using VS Code Source Control Tab
    "git.enableSmartCommit": true,
    // disable GitLens code lens (distracting)
    "gitlens.codeLens.enabled": false,
    // disable GitLens annotations on current line (distracting)
    "gitlens.currentLine.enabled": false,
    // trigger hover for the current line
    "gitlens.hovers.currentLine.over": "line",
    // create a vertical colored line for indentation
    "indentRainbow.indicatorStyle": "light",
    // don't ask when restarting Jupyter kernels
    "jupyter.askForKernelRestart": false,
    // allow to step out of user written code
    "jupyter.debugJustMyCode": false,
    // create an interactive window per file (see tips and tricks)
    "jupyter.interactiveWindow.creationMode": "perFile",
    // send the selected code to the interactive window instead of terminal
    "jupyter.interactiveWindow.textEditor.executeSelection": true,
    // enable the auto-reload extension by default for Jupyter notebooks
    "jupyter.runStartupCommands": [
        "%load_ext autoreload",
        "%autoreload 2"
    ],
    // disable smart scrolling (lock scrolling when output view is selected)
    "output.smartScroll.enabled": false,
    // automatically format Python imports and code on save
    "[python]": {
        "editor.codeActionsOnSave": {
            "source.organizeImports": true,
        },
        "editor.defaultFormatter": "charliermarsh.ruff",
    },
    // disable redhat telemetry (avoid a popup on first use)
    "redhat.telemetry.enabled": false,
    // allow untrusted files in the workspace when opened
    "security.workspace.trust.untrustedFiles": "open",
    // don't synchronize the following settings
    "settingsSync.ignoredSettings": [
        "projectManager.git.baseFolders"
    ],
    // use the same keybindings on Linux, Mac, and Windows
    // note: you might want to drop this setting depending on your keybindings
    "settingsSync.keybindingsPerPlatform": false,
    // don't ask which problem matcher to use for executing VS Code tasks
    "task.problemMatchers.neverPrompt": true,
    // disable multiline paste warning by default
    "terminal.integrated.enableMultiLinePasteWarning": false,
    // enabled stronger integration between VS Code and the terminal
    "terminal.integrated.shellIntegration.enabled": true,
    // don't automatically open the peek view after running unit tests
    "testing.automaticallyOpenPeekView": "never",
    // don't follow the test currently running in the Test Explorer View
    "testing.followRunningTest": false,
    // open the Text Explorer View on failure
    "testing.openTesting": "openOnTestFailure",
    // ask VS Code to change settings required for running IntelliCode
    "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
    // replace VS Code title bar by the command certer (menu, selections, widgets, ...)
    "window.commandCenter": true,
    // don't enable mnemonics shortcuts (e.g., ALT + ...)
    // this is related to my Alt-key trick, more on that later
    "window.enableMenuBarMnemonics": false,
    // authorize the title bar to be changed for enabling the command center
    "window.titleBarStyle": "custom",
    // don't preview file (pending opening state), open them directly instead
    "workbench.editor.enablePreview": false,
    // focus on the tab on the left instead of the most recent one
    "workbench.editor.focusRecentEditorAfterClose": false,
    // all open tab will be opened in multiple line (instead of scroll bar)
    "workbench.editor.wrapTabs": true,
}

How to configure VS Code for using the Jupyter Extension with uv?

To configure VS Code for using the Jupyter Extension with uv, follow these steps to ensure that your uv-managed virtual environment is recognized within VS Code. This allows you to use the Jupyter Extension seamlessly with the Python interpreter provided by uv.

  1. Install the Jupyter Extension: First, ensure that the Jupyter Extension is installed in VS Code. You can find and install this extension from the VS Code Marketplace.
  2. Open Your Project in VS Code: Open your project folder in VS Code. If you've just created a new uv project, this will be the directory containing your pyproject.toml file.
  3. Select Python Interpreter: To make VS Code use the Python interpreter from your uv environment:
    • Open the Command Palette (Ctrl+Shift+P on Windows/Linux, Cmd+Shift+P on macOS).
    • Type Python: Select Interpreter and select it.
    • Look for the interpreter that corresponds to your uv environment. It will typically be located under the .venv path within your project directory or listed as a virtual environment with your project's name.
    • Select the appropriate interpreter.
  4. Verify Jupyter Notebook Configuration: Create a new Jupyter notebook in VS Code (*.ipynb file) and verify that the cells execute using the Python interpreter from your uv environment. You can check the upper-right corner of the notebook interface to see which interpreter is currently active.
  5. Install Necessary Libraries: If you need additional Python libraries that are not yet part of your uv project, you can add them by running uv add <library-name> in your terminal or command prompt. This ensures that all dependencies are managed by uv and available in the notebook.

VS Code additional resources