Visual Studio Code Setup for Python Django Development

Visual Studio Code is one of the most popular code editor. Released in 2015, it is actively developed and maintained by Microsoft. The source code for this code editor is available in github. The editor itself is built with Electron (TypeScript, JavaScript, HTML & CSS).

In this tutorial, we will setup Visual Studio Code for Django Development.

VSCode Installation

Download and install VSCode from https://code.visualstudio.com/download

Installing Required Extensions

Below are the most important extensions which are necessary for Django Development.

In Mac, extensions are installed at ~/.vscode/extensions. For Windows, the path is %USERPROFILE%\.vscode\extensions

For installing extensions, select extensions tab and search for extensions in Marketplace.

Visual Studio IntelliCode

Provides AI-assisted develpment features for Python, TypeScript/JavaScript and Java

Python

Provides support for python language

Pylance

Works alongside python extension and provides fast IntelliSense experience

Installing Theme

My personal preference is PyCharm's Darcula Theme. Search and install “Darcula Pycharm Theme” in marketplace

For improving icons layout, install VSCode Great Icons
Install the extension from Marketplace and activate

(File → Preferences on Windows, or Code → Preferences on OSX), choose File Icon Theme, and select VSCode Great Icons.

Keyboard shortcuts and other settings

Opening new terminal

Terminal > New Terminal Ctrl + Shift + `

Switching between multiple terminal

File → Preferences → Keyboard Shortcuts or press Ctrl + k + Ctrl + s

Click on upper right corner to open the keybinding. For Windows, update below cmd to ctrl


[
  ...
  {
    "key": "cmd+left",
    "command": "workbench.action.terminal.focusNext",
    "when": "terminalFocus"
  },
  {
    "key": "cmd+right",
    "command": "workbench.action.terminal.focusPrevious",
    "when": "terminalFocus"
  }
  ...
]

Now, cmd+left & cmd+right will switch between different terminal

This step is optional. I prefer using Cmd + [ and Cmd + ] for code navigation. Press Ctrl + k + Ctrl + s to open Keyboard Shortcuts and update the shortcut keys.

Go Back - Cmd + [
Go Forward - Cmd + ]