vscode-docs icon indicating copy to clipboard operation
vscode-docs copied to clipboard

Update overall getting started experience

Open ntrogh opened this issue 1 year ago • 5 comments

Improve the overall getting started docs experience for new users.

  • [x] Review getting started documentation section and
  • [x] Create an outline for a guided getting started experience.
  • [ ] Create Getting Started tutorial
  • [ ] Update docs landing page and CTAs
  • [ ] Evaluate how we can align the in-product walkthroughs with the Getting Started tutorial.

ntrogh avatar Jun 07 '24 08:06 ntrogh

Outline for Getting Started tutorial. The objective is to take a user through a guided tour of the key features of VS Code.

  • Open a workspace
    • Create a new folder
    • Open folder in VS Code
    • Explain concept of workspace
  • Learn about the user interface
    • Activity Bar + views
    • Editor
    • Panel (mention integrated terminal)
    • Command Palette
  • Edit a code file
    • Create app.js file
    • Intro to IntelliSense
    • Enable auto save
    • Create a Python file -> no IntelliSense
  • Install a language extension
    • Install Python extension -> IntelliSense, Debugging, Testing, ...
    • Many other extensions available (themes, ...)
  • Run your code
    • Make sure Node is installed
    • Open integrated terminal > node app.js
    • Use F5 to use built-in debugging capabilities
  • Customize VS Code
    • Appearance -> change color theme
    • Settings -> Font Size
    • Much more, such as keybindings, ...
  • Next steps
    • Tips & tricks
    • Edit basics
    • Source control
    • Integrated terminal
    • Debugging
    • Testing

@bhavyaus here's a first draft of the outline for the VS Code getting started tutorial. Do you see any key topics that are missing for someone's first experience with VS Code?

ntrogh avatar Jun 25 '24 11:06 ntrogh

@bamurtaugh sharing the draft outline for a VS Code Getting Started tutorial. Any feedback is welcome!

ntrogh avatar Jun 26 '24 08:06 ntrogh

  1. Should Customize VS Code section appear right after the Learn about the user interface section? Past user studies suggest that offering some level of customization at the start of user interactions tends to result in sustained engagement -> the first step in the getting started walkthrough is "Choose your theme". @daviddossett might have more info here.

  2. Install a language extension should be before Edit a code file so that users can edit and run the code in the language of their choice.

bhavyaus avatar Jun 26 '24 17:06 bhavyaus

@bhavyaus thanks for the feedback. I'll incorporate it.

ntrogh avatar Jun 28 '24 08:06 ntrogh

Thanks for putting this together, looks great!

I think it could be interesting incorporate Remote Development and GitHub Copilot, maybe as Next Steps? They could become fundamental to how users develop with VS Code everyday, so I think they could make sense to highlight somewhere in a getting started.

bamurtaugh avatar Jun 28 '24 20:06 bamurtaugh