Supercharging your Python Development Environment with VS Code and Dev Containers

Dawn Wages
Python Community Advocate @
VS Code
Dev Containers
Codespaces
Supercharge your
Python & Django
Development
Environment
with VS Code and Dev Containers

Become VS Code Power
Users 💪🏾
Settings, settings and more
settings.
Make Open Source
Contribution easier 💖
A tool for open source
onboarding.
Code collaboratively 🫱
🏽🫱🏾
Working across your team.
Access GPU for free* 💽
Do it with the power of Azure cloud
in your browser.
We’re going to...
VS Code
Dev Containers
Codespace
s
https://dawnwages.info | BajoranEngineer@mastodon.online
* up to 60 hours per month

BajoranEngineer@mastodon.online
Dawn Wages
• Data, Python and Django Engineer
• Organizer for Djangonaut Space
• Ethical Open Source Advocate & creator
of the AntiRacist Ethical Source License
• Chair of the Python Software
Foundation
• Host of the Python Pulse live stream
whoami
Every 2nd Friday of the month 11am PT / 10pm Eastern Africa Time.

There are a bunch of
extensions and settings and I
don’t know how or what to use
to configure them!
— Pythonistas exploring VS Code

Settings pro tips:
Tips to help you go farther, faster in your extensible editor.
Become VS Code Power Users 💪🏾
VS Code
User-level
Settings are not
shared.
Workspace-level
Settings will be
committed.
Turn on
settings sync
Create profiles for all of your
uses cases and share with
friends.

Four clicks you can start with default Python settings.
Three clicks you can export those settings and share it with a colleague.
Two clicks you can open your VS Code settings in the browser and start developing there.
What are VS Code
profiles?

VIDEO
Let’s create and export a
VS Code profile.

VS Code
VS Code Profiles from the Python Pulse
Data
Wrangler
Python
Testing
GitHub
Data
Science

The Python Pulse
Live Stream
https://aka.ms/pythonpulse/playlist

Workspace settings:
Persist configurations on your project regardless of it is single root or
multi-root.
VS Code
User-level
Settings
Workspace-level
Settings
.vscode
requirements.txt
pyproject.toml
.gitignore
environment.yml
tasks.json
launch.json
settings.json
extensions.json
U
I
<project>
<project>.code-workspace

VIDEO
Show VS Code and show the settings
folder

Workspace settings:
workspace settings.json can be accessed with CTRL + ,
VS Code
User-level
Settings
Workspace-level
Settings
.vscode
requirements.txt
pyproject.toml
.gitignore
environment.yml
tasks.json
launch.json
extensions.json
U
I
<project>
settings.json

VS Code
U
I
settings.json
Workspace settings:
Code navigation enabled on strings that contain module names.
Enables Go to Definition from
module-like string literals.
This can be particularly helpful if you’re
working on web applications, like Django, and
want to navigate to modules defined in string
literals.

VIDEO
Go to Python Extension UI to share
features and what is possible, also go to
Python Extensions to show features and
release notes

Workspace settings:
Integrate with external tools via Tasks like linting, building, packaging,
testing or deploying.
VS Code
User-level
Settings
Workspace-level
Settings
.vscode
requirements.txt
pyproject.toml
.gitignore
environment.yml
tasks.json
launch.json
settings.json
extensions.json
U
I
<project>

Workspace settings:
Helps with workspace templates to recommend extensions without
automatically installing them inside or outside of the Dev Container.
VS Code
User-level
Settings
Workspace-level
Settings
.vscode
requirements.txt
pyproject.toml
.gitignore
environment.yml
tasks.json
launch.json
settings.json
extensions.json
U
I
<project>

Workspace settings:
persist configurations in VS Code’s built in debugger support.
VS Code
User-level
Settings
Workspace-level
Settings
.vscode
requirements.txt
pyproject.toml
.gitignore
environment.yml
tasks.json
launch.json
settings.json
extensions.json
U
I
<project>

Workspace settings:
Defines configurations of a multi-root workspace.
VS Code
User-level
Settings
Workspace-level
Settings
.vscode
requirements.txt
pyproject.toml
.gitignore
environment.yml
tasks.json
launch.json
settings.json
extensions.json
U
I
<project>

Workspace settings:
Common Python project artifacts that VS Code uses to create
environment with VS Code or defines the environment to conda.
VS Code
User-level
Settings
Workspace-level
Settings
.vscode
requirements.txt
pyproject.toml
.gitignore
environment.yml
tasks.json
launch.json
settings.json
extensions.json
U
I
<project>

VS Code
My favorite extensions
Extensions and Extension Packs to extend your extensible editor.

VS Code

VS Code
#22222
https://github.com/microsoft/vscode-python/issues/22222

VS Code
Pro Tip: You can create your own
extension pack and share them
for amongst your team.
💡

Code collaboratively 🫱🏽🫱🏾
VS Code

⇧⌘
↓ ↑
⌥↓ ⌥↑ ⇧⌘
⌘ ⌘ ⌘ ⌘
⇧⌘ ⌘ ⌃ ⌘
⌘ ⌘
General Basic Editing Navigation
Rich Languages
Editing
My favorite shortcut Keys
VS Code
Other operating systems' keyboard shortcuts and additional unassigned shortcuts available at
aka.ms/vscodekeybindings

VS Code
⚡Ctrl+P will let you navigate to any file or symbol by typing its name
⚡Ctrl+Tab will cycle you through the last set of files opened
⚡Ctrl+Shift+P will bring you directly to the editor commands
⚡Ctrl+Shift+O will let you navigate to a specific symbol in a file
⚡Ctrl+G will let you navigate to a specific line in a file
⚡Ctrl+ to split the active editor into two.
⚡Alt+Click to insert cursor.
⚡Ctrl+G to go to line.
⚡Ctrl+T to show all symbols.
⚡Open vs code with Ctrl+O in the app or use `code <directory_name>`
Other operating systems' keyboard shortcuts and additional unassigned shortcuts available at
aka.ms/vscodekeybindings

Summary
VS Code
• sync settings, share settings, users settings and workspace settings
• Create profiles and experiment with the available extensions
• use shortcut keys to navigate faster
VS Code

It works on my machine!
— every engineering team I’ve been on

Developing and Deploying
Development
Briefly elaborate on
what you want to
discuss.
Pre-production
what you want to
discuss.
Test
what you want to
discuss.
Production
what you want to
discuss.
Dev Containers
Code collaboratively 🫱🏽
🫱🏾

Development
what you want to
discuss.
Pre-production
what you want to
discuss.
Test
what you want to
discuss.
Production
what you want to
discuss.
🫱🏾
Dev Containers

🫱🏾
Development Pre-production
Test Production
Dev Containers
Your file system is mounted and
cloned to your development
environment

🫱🏾
Test Production
Dev Containers
All of your VS Code Extensions are
available to set up in your dev
container.

🫱🏾
Test Production
Dev Containers
Easily expose ports for
development.

🫱🏾
Dev Containers
Install Docker
Desktop
Install VS Code &
Dev Containers
Extension

🫱🏾
Dev Containers
Copy or create
.devcontainers
settings
Search for projects with Dev Containers

VIDEO
Walkt through a project with a
devcontainer + add an extension to it

Pick from any
existing Docker
image or create
your own.
Remove local
development
settings to
trouble shoot
production
environment.
Changes are
reflected
declaratively and
are committed
along with your
code.
🫱🏾
Dev Containers

Contribute to
Open Source
with
Dev Containers
Review PRs Quickly
Allow you to check out the project at
its current state from a pull request.
Complicated
development set ups
become easy
Won’t be a barrier for new
contributors.
Declarative settings
committed with code.
Makes it easy to track environment
changes.
Make Open Source
Dev Containers

🫱🏾
Dev Containers
The best devcontainer.json settings
provide a docker file for creating the container
when project closes you can stop the container

🫱🏾
Dev Containers
The best devcontainer.json settings
specify how noisey your ports are
provide commands for after your container is created

Use
everything
we just
learned with
GitHub
Codespaces
🫱🏾
Dev Containers
Make Open Source
Dev Containers
VS Code
Codespace
s
VS Code

Start coding instantly
Start with a pre-configured dev
environment.
Your own Virtual
Machine
from 2 cores, 8GB RAM, and 32 GB
storage, up to 32 cores, 64GB of
RAM, and 128 GB storage.
Flexible tools
VS Code, JetBrains application
or GitHub CLI
Codespace
s

Became VS Code Power
Users 💪🏾
Settings, settings and ore settings.
Made Open Source
A tool for open source
onboarding.
Coded collaboratively 🫱
🏽🫱🏾
Working across your team
Accessed GPU for free* 💽
Do it with the power of Azure cloud
in your browser.
We...
VS Code
Dev Containers
Codespace
s

Thank you!
Questions?

Supercharging your Python Development Environment with VS Code and Dev Containers

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Supercharging your Python Development Environment with VS Code and Dev Containers

Similar to Supercharging your Python Development Environment with VS Code and Dev Containers (20)

Recently uploaded

Recently uploaded (20)

Supercharging your Python Development Environment with VS Code and Dev Containers