Supercharging your Python Development Environment with VS Code and Dev Containers
- 1. Dawn Wages Python Community Advocate @ VS Code Dev Containers Codespaces Supercharge your Python & Django Development Environment with VS Code and Dev Containers
- 2. 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 | [email protected] * up to 60 hours per month
- 3. [email protected] https://dawnwages.info | [email protected] 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.
- 4. There are a bunch of extensions and settings and I don’t know how or what to use to configure them! https://dawnwages.info | [email protected] — Pythonistas exploring VS Code
- 5. 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. https://dawnwages.info | [email protected]
- 6. 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?
- 7. VIDEO Let’s create and export a VS Code profile.
- 8. Become VS Code Power Users 💪🏾 VS Code VS Code Profiles from the Python Pulse https://dawnwages.info | [email protected] Data Wrangler Python Testing GitHub Data Science
- 9. The Python Pulse Live Stream https://aka.ms/pythonpulse/playlist
- 10. The Python Pulse Live Stream https://aka.ms/pythonpulse/playlist
- 11. Workspace settings: Persist configurations on your project regardless of it is single root or multi-root. Become VS Code Power Users 💪🏾 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> https://dawnwages.info | [email protected] <project>.code-workspace
- 12. VIDEO Show VS Code and show the settings folder
- 13. Workspace settings: workspace settings.json can be accessed with CTRL + , Become VS Code Power Users 💪🏾 VS Code User-level Settings Workspace-level Settings <project>.code-workspace .vscode requirements.txt pyproject.toml .gitignore environment.yml tasks.json launch.json extensions.json U I <project> settings.json https://dawnwages.info | [email protected]
- 14. Become VS Code Power Users 💪🏾 VS Code U I settings.json Workspace settings: Code navigation enabled on strings that contain module names. https://dawnwages.info | [email protected] 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.
- 15. VIDEO Go to Python Extension UI to share features and what is possible, also go to Python Extensions to show features and release notes
- 16. Workspace settings: Integrate with external tools via Tasks like linting, building, packaging, testing or deploying. Become VS Code Power Users 💪🏾 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> https://dawnwages.info | [email protected] <project>.code-workspace
- 17. Workspace settings: Helps with workspace templates to recommend extensions without automatically installing them inside or outside of the Dev Container. Become VS Code Power Users 💪🏾 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> https://dawnwages.info | [email protected] <project>.code-workspace
- 18. Workspace settings: persist configurations in VS Code’s built in debugger support. Become VS Code Power Users 💪🏾 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> https://dawnwages.info | [email protected] <project>.code-workspace
- 19. Workspace settings: Defines configurations of a multi-root workspace. Become VS Code Power Users 💪🏾 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> https://dawnwages.info | [email protected] <project>.code-workspace
- 20. Workspace settings: Common Python project artifacts that VS Code uses to create environment with VS Code or defines the environment to conda. Become VS Code Power Users 💪🏾 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> https://dawnwages.info | [email protected] <project>.code-workspace
- 21. Become VS Code Power Users 💪🏾 VS Code My favorite extensions Extensions and Extension Packs to extend your extensible editor. https://dawnwages.info | [email protected]
- 22. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected]
- 23. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected] #22222 https://github.com/microsoft/vscode-python/issues/22222
- 24. Become VS Code Power Users 💪🏾 VS Code Pro Tip: You can create your own extension pack and share them for amongst your team. 💡 https://dawnwages.info | [email protected]
- 25. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected]
- 26. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected]
- 27. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected]
- 28. Code collaboratively 🫱🏽🫱🏾 VS Code https://dawnwages.info | [email protected]
- 29. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected]
- 30. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected]
- 31. ⇧⌘ ↓ ↑ ⌥↓ ⌥↑ ⇧⌘ ⌘ ⌘ ⌘ ⌘ ⇧⌘ ⌘ ⌃ ⌘ ⌘ ⌘ General Basic Editing Navigation Rich Languages Editing My favorite shortcut Keys Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected] Other operating systems' keyboard shortcuts and additional unassigned shortcuts available at aka.ms/vscodekeybindings
- 32. Become VS Code Power Users 💪🏾 VS Code https://dawnwages.info | [email protected] ⚡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
- 33. Summary https://dawnwages.info | [email protected] Become VS Code Power Users 💪🏾 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 Code collaboratively 🫱🏽🫱🏾 VS Code
- 34. It works on my machine! https://dawnwages.info | [email protected] — every engineering team I’ve been on
- 35. Developing and Deploying Development Briefly elaborate on what you want to discuss. Pre-production Briefly elaborate on what you want to discuss. Test Briefly elaborate on what you want to discuss. Production Briefly elaborate on what you want to discuss. Dev Containers Code collaboratively 🫱🏽 🫱🏾 https://dawnwages.info | [email protected]
- 36. Developing and Deploying Development Briefly elaborate on what you want to discuss. Pre-production Briefly elaborate on what you want to discuss. Test Briefly elaborate on what you want to discuss. Production Briefly elaborate on what you want to discuss. Code collaboratively 🫱🏽 🫱🏾 Dev Containers https://dawnwages.info | [email protected]
- 37. Developing and Deploying Code collaboratively 🫱🏽 🫱🏾 Development Pre-production Test Production Dev Containers Your file system is mounted and cloned to your development environment https://dawnwages.info | [email protected]
- 38. Developing and Deploying Code collaboratively 🫱🏽 🫱🏾 Development Pre-production Test Production Dev Containers All of your VS Code Extensions are available to set up in your dev container. https://dawnwages.info | [email protected]
- 39. Developing and Deploying Code collaboratively 🫱🏽 🫱🏾 Development Pre-production Test Production Dev Containers Easily expose ports for development. https://dawnwages.info | [email protected]
- 40. Code collaboratively 🫱🏽 🫱🏾 Dev Containers Install Docker Desktop Install VS Code & Dev Containers Extension https://dawnwages.info | [email protected]
- 41. Code collaboratively 🫱🏽 🫱🏾 Dev Containers Copy or create .devcontainers settings Search for projects with Dev Containers https://dawnwages.info | [email protected]
- 42. VIDEO Walkt through a project with a devcontainer + add an extension to it
- 43. 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. Code collaboratively 🫱🏽 🫱🏾 Dev Containers https://dawnwages.info | [email protected]
- 44. 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 Contribution easier 💖 Dev Containers https://dawnwages.info | [email protected]
- 45. Code collaboratively 🫱🏽 🫱🏾 Dev Containers The best devcontainer.json settings https://dawnwages.info | [email protected] provide a docker file for creating the container when project closes you can stop the container
- 46. Code collaboratively 🫱🏽 🫱🏾 Dev Containers The best devcontainer.json settings https://dawnwages.info | [email protected] specify how noisey your ports are provide commands for after your container is created
- 47. Use everything we just learned with GitHub Codespaces Code collaboratively 🫱🏽 🫱🏾 Dev Containers Make Open Source Contribution easier 💖 Dev Containers Become VS Code Power Users 💪🏾 VS Code Codespace s Access GPU for free* 💽 * up to 60 hours per month https://dawnwages.info | [email protected] Code collaboratively 🫱🏽🫱🏾 VS Code
- 49. 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 Access GPU for free* 💽 * up to 60 hours per month https://dawnwages.info | [email protected]
- 50. Became VS Code Power Users 💪🏾 Settings, settings and ore settings. Made Open Source Contribution easier 💖 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 https://dawnwages.info | [email protected] * up to 60 hours per month