Visual Studio Code Can Do That: Tips & Tricks

2. @john_papa @burkeholland

3. @john_papa @burkeholland

4. @john_papa @burkeholland

5. @john_papa @burkeholland

6. @john_papa @burkeholland

7. @john_papa @burkeholland

8. editor IDE
lightweight/fast
file/folders
many languages
many workflows
keyboard centered
project systems
code understanding
debug
integrated build
File>New, wizards
designers
ALM integration
platform tools
...
lightweight/fast
file/folders with project context
many languages
keyboard centered
code understanding (some languages)
debug
task running
@john_papa @burkeholland

9. simplicity of a code editor
code-edit-debug cycle
-- Erich Gamma
Visual Studio Code
@john_papa @burkeholland

10. Monaco Electron TypeScript
@john_papa @burkeholland

11. @john_papa @burkeholland

12. @john_papa @burkeholland

13. @john_papa @burkeholland

14. @john_papa @burkeholland

15. @john_papa @burkeholland

16. @john_papa @burkeholland

17. @john_papa @burkeholland

18. @john_papa @burkeholland

19. Resources
VS Code
Free Azure trial
Node Extensions
Angular Essentials
Extension Marketplace
Keyboard Shortcuts for macos
Keyboard shortcuts for Windows
@john_papa @burkeholland
https://aka.ms/codeit
https://aka.ms/jp-free
https://aka.ms/vsc-node
https://aka.ms/ng-essentials
https://aka.ms/jp-codeext
https://aka.ms/jp-code-mackeys
https://aka.ms/jp-code-winkeys

20. @john_papa @burkeholland

21. @john_papa
Hop Light
Material Icons
Burke’s Setup
@burkeholland

22. @john_papa
Winter is Coming
Material Icons
John’s Setup
@burkeholland

23. @john_papa
Winter Is Coming
Atom Dark
Cobalt2
Popular Themes
@burkeholland

24. @john_papa
Fira Code
Instructions
Font Ligatures
@burkeholland

25. Insiders Build
@john_papa
Latest features!
@burkeholland

26. Interactive Playground
@john_papa
Try out features
Learn
@burkeholland

27. @john_papa
Navigation
@burkeholland
File Search / Fuzzy Match
Symbol Search
Toggle Sidebar
Toggle Lower Pane
Hide Open Files
Hiding Recommendations
P⌘P
@ @
B B
`
⌘
`
"explorer.openEditors.visible": 0
"extensions.showRecommendationsOnlyOnDemand": true

28. External Terminal
@john_papa
Current folder

29. Terminal in VS Code
@john_papa
Choose your shell
Stacked terminals

30. Emmet
@john_papa
Rapid HTML creation
Learn More
@burkeholland

31. Prettier
@john_papa
Code Formatting
On Save, Paste, Type
@burkeholland

32. JSON Intellisense
@john_papa
JSON Schemas
npm versions
@burkeholland

33. Multiple Cursors
@john_papa
Edit like a pro
Progressive
selection
Find matches
@burkeholland

34. Quick Fixes
@john_papa
Auto import
Correct syntax
Lint fixes
Smart
suggestions
@burkeholland

35. Refactoring
@john_papa
Find references
Rename symbols
Peek
@burkeholland

36. JavaScript Type
Checking
@john_papa
Check javascript
Using typescript
//@ts-check
@burkeholland

37. Snippets
@john_papa
Code faster
Language specific
@burkeholland

38. Node.js Debugging
@john_papa
Start debugger
Breakpoints
Column Breakpoints
Inspect and change
@burkeholland

39. Dockerize Your App
@john_papa
Add docker files
@burkeholland

40. Serverless – Azure Functions
@john_papa
Create projects
Create functions
List Projects
Publish To Azure
@burkeholland

41. Cosmos DB – Mongo DB
@john_papa
Manage DB’s
Execute queries
Local MongoDB
@burkeholland

42. Setting Sync
@john_papa
Save to gist
Share with friends
@burkeholland

43. Extensions
@john_papa
5000+
Marketplace
Make Your Own
@burkeholland

44. Resources
VS Code
Free Azure trial
Node Extensions
Angular Essentials
Extension Marketplace
Keyboard Shortcuts for macos
Keyboard shortcuts for Windows
@john_papa @burkeholland
https://aka.ms/codeit
https://aka.ms/jp-free
https://aka.ms/vsc-node
https://aka.ms/ng-essentials
https://aka.ms/jp-codeext
https://aka.ms/jp-code-mackeys
https://aka.ms/jp-code-winkeys

45. More Visual Studio Code at //Build
js apps with VS Code
C++ Development
@john_papa @burkeholland