explaingit

microsoft/codetour

4,528TypeScriptAudience · developerComplexity · 1/5Setup · easy

TLDR

A Visual Studio Code extension that lets you record and play back guided, annotated walkthroughs of a codebase, with each step pointing to a specific file and line of code with an explanation.

Mindmap

mindmap
  root((repo))
    What it does
      Record code tours
      Annotate code lines
      Play back tours
    Features
      Shell command steps
      Numbered sequences
      Auto-start option
    Use Cases
      Onboarding devs
      PR walkthroughs
      Bug explanations
    Audience
      Developers
      Tech leads
      Contributors
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Create a step-by-step onboarding tour for new contributors to understand your project's codebase.

USE CASE 2

Walk a code reviewer through the reasoning behind pull request changes by annotating the key files.

USE CASE 3

Record an explanation of a bug and its relevant code sections to share as a narrated walkthrough.

USE CASE 4

Build a multi-part tutorial for your codebase that auto-advances through numbered tours in sequence.

Tech stack

TypeScriptVisual Studio Code

Getting it running

Difficulty · easy Time to first run · 5min
License not mentioned in the explanation, check the repository for details.

In plain English

CodeTour is an extension for Visual Studio Code, the popular code editor, that lets you create and play back guided walkthroughs of a codebase. Think of it as a narrated tour where each stop is a specific file and line of code, with a written explanation attached. Someone new to a project can follow the tour step by step, reading annotations that explain what each piece of code does and why it matters, without needing to ask a colleague or dig through a contributing guide. Creating a tour is done entirely inside the editor. You click a record button, then open files and click on the lines you want to annotate. You type a description for each stop, which can include formatted text. When you are finished, you stop the recording. The tour is saved as a JSON file that can be checked into the repository alongside the code, so every contributor who clones the project has access to the same guided walk. Tours can be structured in sequences. If you prefix tour names with numbers, the extension automatically links them so readers move from one tour to the next in order. You can also mark one tour as the primary tour, and the extension will offer to start it automatically when someone opens the project for the first time. Beyond onboarding, the extension is useful for explaining a bug report by walking through the relevant code, or for giving context on a pull request so reviewers understand the reasoning behind changes. Tours can be exported to a standalone file and shared with anyone, even without cloning the repository. The extension supports embedding shell commands as tour steps, so a tour can include runnable instructions alongside explanations. Tours are stored as plain text files, which means they work with version control and can be updated through normal code review processes. The full README is longer than what was shown.

Copy-paste prompts

Prompt 1
I want to create a CodeTour for my project to onboard new developers. Suggest the key stops I should include, covering entry point, config files, and main business logic.
Prompt 2
Show me the JSON format for a CodeTour file so I can create one manually without using the VS Code recording interface.
Prompt 3
I want to add a CodeTour step that runs a shell command to install dependencies. Show me what the tour step JSON should look like.
Prompt 4
I have a complex pull request. Describe how to use CodeTour to annotate the key files and lines so reviewers understand the context of each change.
Open on GitHub → Explain another repo

← microsoft on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.