VSCode as an IDLE for Django

Posted on November 15, 2019

I documented two articles about the IDLE for Python development before:

This is another one to using MS VSCode as Django IDLE (OS: Mac OX, the steps are referenceable on Linux, Windows).

1. Download installation files and Install MS VScode, Python

On Mac OS, I recommend homebrew for Python Installation because third party libraries’ dependency will be processed smoothly.

Install homebrew:

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Install Python3:

brew install python@3
2. Install virtualenv, Django
  • Run the command in terminal to install virtualenv

    pip3 install virtualenv
    
  • homebrew

     1
     2
     3
     4
     5
     6
     7
     8
     9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    
    % pip3  install virtualenv
    Collecting virtualenv
    Downloading https://files.pythonhosted.org/packages/c5/97/00dd42a0fc41e9016b23f07ec7f657f636cb672fad9cf72b80f8f65c6a46/>virtualenv-16.7.7-py2.py3-none-any.whl (3.4MB)
        100% |████████████████████████████████| 3.4MB 5.2MB/s
    Installing collected packages: virtualenv
    Could not install packages due to an EnvironmentError: [Errno 13] Permission denied: '/Library/>Python/3.7'
    Consider using the `--user` option or check the permissions.>
    
    You are using pip version 19.0.3, however version 19.3.1 is available.
    You should consider upgrading via the 'pip install --upgrade pip' command.>
    
    % pip3  install virtualenv --user
    Collecting virtualenv
    Using cached https://files.pythonhosted.org/packages/c5/97/00dd42a0fc41e9016b23f07ec7f657f636cb672fad9cf72b80f8f65c6a46/>virtualenv-16.7.7-py2.py3-none-any.whl
    Installing collected packages: virtualenv
    The script virtualenv is installed in '/Users/admin/Library/Python/3.7/bin' which is not on PATH.
    Consider adding this directory to PATH or, if you prefer to suppress this warning, use >--no-warn-script-location.
    Successfully installed virtualenv-16.7.7
    You are using pip version 19.0.3, however version 19.3.1 is available.
    You should consider upgrading via the 'pip install --upgrade pip' command.>
    
    % pip3 install --upgrade pip --user
    Collecting pip
    Using cached https://files.pythonhosted.org/packages/00/b6/>9cfa56b4081ad13874b0c6f96af8ce16cfbc1cb06bedf8e9164ce5551ec1/pip-19.3.1-py2.py3-none-any.whl
    Installing collected packages: pip
    Successfully installed pip-19.3.1

    Note: Please task care of the highlight content, especially line: 16-17.

  • Active virtual environment and Install Django in VSCode

    • Select or create a folder for Django project

      mkdir django_test
      
    • Create a sub folder for Python virtual environment

      cd django_test
      mkdir venv
      virtualenv venv
      

      Note: For the case it prompts you command not found: virtualenv, please check the #2 -> homebrew part, you could using /Users/admin/Library/Python/3.7/bin/virtualenv instead, or adding /Users/admin/Library/Python/3.7/bin/ to PATH.

    • Active virtual environment in VSCode

      Launch VSCode and install the Extension: Python

      Install Extension
      Install Extension

      Note: Pay attention to the prompt of ‘Install’ button because restart MS VScode might be required

      Open folder-1
      Open folder-1
      Open folder-2
      Open folder-2
      Active virtual Environment
      Active virtual Environment
      Select VE depends the path
      Select VE depends the path
    • Active terminal in VSCode, install Django

      Active terminal
      Active terminal

      Note: The hot key to active the terminal on Mac OS is Control + `

      VSCode active VE automatically
      VSCode active VE automatically

      Execute following command in the terminal to install Django:

      pip3 install django
      
3. Run Django

Congratulations! you can work on your django project within VSCode right now.

With MS VScode task feature, some regular task could be executed easily, let's say Django runserver command.

  • Configure task

    New Task 1
    New Task 1
    New Task 2
    New Task 2
    New Task 3
    New Task 3
    New Task 4
    New Task 4

    A new window will pop up, edit the file and save it. Here is a sample about tasks.json:

    {
        // See https://go.microsoft.com/fwlink/?LinkId=733558
        // for the documentation about the tasks.json format
        "version": "2.0.0",
        "tasks": [
            {
                "label": "Run Django",
                "type": "shell",
                "command": "/Users/kezh/Documents/project/django_test/venv/bin/python3 /Users/kezh/Documents/project/django_test/testprj/manage.py runserver 0.0.0.0:8000"
            }
        ]
    }
    

    The command is consist of:

  • Run task

    Run Task 1
    Run Task 1
    Run Task 2
    Run Task 2
    Run Task 3
    Run Task 3
    Run Task 4
    Run Task 4
    Run Task 5
    Run Task 5

VSCode as an IDLE for Django


donation

Scan the QR code using WeChat

comments powered by Disqus