- Install the JSON Formatter extension for Chrome
- Ensure you've already authenticated with VSO + GitHub once, so that you can push changes during the demo, without needing to auth
- Ensure that you've opened up the
conduit/apps/articles/views.py
file once, and leave it open, so that VSO will default it to be open for you when you create a new environment
- Developer sees an issue on GitHub and clicks a link to deep link into an instance. The issue mentions that the REST API no longer returns articles, even though they're in the database - Create VSO Environment
- Show that they don’t have Python installed on their local machine
- They create the environment and are taken into the web editor, with…
- The repo automatically cloned
- Their Python dependencies installed (Python/PIP are now available in the terminal) - Run “python —version” from the terminal
- Their extensions automatically installed (the Python extension) - Switch to the extensions tab and show it (May need to reload)
- The app automatically built (PIP install was run) - Show the VSO terminal instance
- Their dot files automatically roamed (shell aliases are available) - Run the “party” command
- Full fidelity tools
- File access/Search
- Extensions (show GitLens?)
- Terminals (run a command such as “ls”)
- Debugging/Port forwarding
- Set a breakpoint on line 30 of articles/views.py
- Hit F5, then select “Python: Django"
- CTRL+Click the URL in the terminal
- Launch the URL and hit “/api/articles”…No articles (!)
- The breakpoint will be hit
- Step the debugger, see the issue and then correct it
- Change line 30 to “if author is not None:” and then re-run the app. You’ll now see the article data returned
- Remove the breakpoint on line 30, hit the debug refresh button, and refresh the browser window to show the article data correctly being returned
- Git operations
- Commit the changes you made and highlight that you're Git identity was roamed
- Push the changes back to the remote, to highlight you automatically have permissions to the repo
- “It’s just like developing with VS Code, but without any of the setup, and accessible from anywhere”
- If I need to open it in desktop, I can (seamless interop, so you can choose how to work)
- Show the change on line 30 in articles/views.py
- When I’m done, I can shut it down, or let it automatically go to sleep
- If I need to open it in desktop, I can (seamless interop, so you can choose how to work)
- With that done, return to the GitHub issue, ready to close it, only to realize that the issue asked you to handle some todos...
Dev starts to make their intended change, and is assisted along the way by IntelliCode…
-
Open up the
Todo Tree
activity bar, and display the flattened view (the second toolbar icon) -
Click on the first
TODO
item, and add the following code insymposion/reviews/forms.py
```python Class StaffRequestForm(forms.Form): staffIDs = forms.CharField(label=_(“Command separated list of IDs”, max_length=5000) ```
-
After completing the above, delete the comment
-
Click on the second todo, and then add the following code to the bottom of
symposion/reviews/views.py
file (within the last function'sif
statement)```python if form.is_valid(): staff_ids = form.cleaned_data.get(“staff_ids”).split(“,”) for staff_ids in staff_ids: accept_staff_suggestion(staff_ids) ```
-
After completing the above, delete the comment. All todos are done!
-
Refactorings (still in
views.py
)- Replace the call to
render
on line 520 with a call to `access_not_permitted'return access_not_permitted(request_review_staff_comment, "you do not have permission to accept staff reviews")
- Scroll up to line 470, and replace a second instance
- Notice that IntelliCode has detected the repeated edits and is suggesting other locations
- Click one of the suggestions in the
Problems
pane and accept it - Select another one, but this time, choose to have IntelliCode submit a PR on your behalf (!)
- When the PR page is launched, highlight that it took care of all of the refactorings, and allowed you to keep your changes focused
- Replace the call to
Dev wants to get some early feedback on their change, so they invite their mentor into an LS session…
- Direct invite (via Contacts pane)
- Chat (via the LS Chat extension being installed)
- Inline code comments (doing a lightweight code review)
- Guest IntelliCode (Optional)
- Debugging/Port forwarding (Optional) - “These work, despite the fact that the host is actually running in the cloud!”