Visual Studio Code (VSC) Editor Workshop

Presenters (your NYC PyLadies organizers)

• Reshama Shaikh | @reshamas on Twitter
• Antonia Blair | @AntoniaBlairArt on Twitter

Logistics: PyLadies & Dropbox

• Introductions
• Bathroom, wifi
• Code of Conduct
• Tweet about event:
  • @NYCPyLadies and also @Dropbox
  • @pythonvscode | #VisualStudio | @code
• Thank you to Dropbox for hosting!
• Dan Crosta talks about Dropbox

Workshop Introduction

• Attendee intros
  • what coding languages do people use?
  • Answer poll here
  • Let's look at responses here
• Use this document to let us know when you are finished with installs / exercises.

Intro & Installing VSC

• 0_intro_install

Set-up

• 1_setup
• Install extensions
  • Python
  • Shell Command

Getting some code to work with

Let's practice using some VSC shortcuts and features!

• We'll work with this small Django blog
  • use git clone or Download manually (GH account not required to download the repo)

Navigating the codebase

• How to navigate this codebase
• See if you can complete the following exercise
• To learn more about Django, you can build this blog at home with: Django Girls tutorial

Important keyboard shortcuts

• 2_1_vsc_shortcuts
• 2_2_editor_shortcuts

Linting and Formatting

• Install extensions for a linter (code style guide)
  • PEP8 linting, autopep8 extension
• Try a short linting exercise
• If you install autopep8, you can then type “format document” in the Command Palette to run the linter on your file.

Git Integration

• VSC provides great Git integration. If you make a change to a file, you will see a blue vertical bar.
• Click on it, and it will show a small inline diff.
• You can also click on the "version control" icon on the left sidebar. (3rd icon down, after magnifying glass icon). That shows differences, just like it would show on GitHub
• Click on top icon (two files) to get back to the code

---

Fun / and for stress reduction

• Stressed after coding for hours? Need a break? Perhaps an inspiration? Something to calm your nerves after almost pushing that fatal git commit? It's Kitty Time! =(＾● ⋏ ●＾)= ෆ
• Kitty extension on VSC

Explore on your own

Watch these 2 videos:

• PyLadies NYC - Getting Started with VS Code for Python by Nina Zakharenko @Microsoft
• Get Productive with Python in Visual Studio Code by Dan Taylor @Microsoft

More git

• You can access git options from the command palette: F1 , type "stage"
• Git plugins to explore:
  • git lens plugin
  • integration with GitHub pull requests
• Can click on last icon on left sidebar for Extensions
• Can search for "github pull request", click on install and then reload to activate it

Terminal and Debugging with VSC

• Watch 4:06 - 9:31 of Nina Zakharenko's helpful video, which explains how the terminal and debug features work

Virtual Environments in VSC

• covered in Dan Taylor's video