Lab 1: Exploring Copilot Surfaces

Inline Suggestions (Ghost Text)

Inline suggestions are Copilot's most iconic feature — gray "ghost text" that appears as you type. This exercise teaches you to trigger, navigate, and control them.

Instructions

1. Create a new file named lab1-explore.ts in your project
2. Type the following function signature and pause after the opening brace:

   function calculateTax(income: number, rate: number): number {

3. Wait 1–2 seconds. Copilot should show gray ghost text suggesting an implementation
4. Do NOT accept it yet. Instead, practice these controls:
   • Tab — Accept the entire suggestion
   • Esc — Dismiss the suggestion
   • Alt+] (Windows/Linux) or Option+] (macOS) — Cycle to the next alternative suggestion
   • Alt+[ / Option+[ — Cycle to the previous alternative
   • Ctrl+→ (Windows/Linux) or Cmd+→ (macOS) — Accept only the next word
5. Press Esc to dismiss, then retype the opening brace to trigger a fresh suggestion. Use Alt+] to cycle through at least 3 alternatives. Notice how they differ.
6. Accept one with Tab.
7. Below that function, type this comment and press Enter:

   // Validate an email address using regex

8. Observe how Copilot generates a full function from the comment. Accept it with Tab.
9. Now type another function signature with more specific types:

   function parseCSVRow(line: string, delimiter: string = ','): string[] {

10. Use Ctrl+Enter (both platforms) to open the Suggestions Panel — this shows multiple completions side-by-side so you can compare and choose.

Copilot Chat Panel

The Chat panel is your conversational interface to Copilot. It can answer questions, explain code, generate new code, and even reason about your entire project.

Instructions

1. Open the Copilot Chat panel:
   • Cmd+Shift+I (macOS) or Ctrl+Shift+I (Windows/Linux)
   • Or click the Copilot icon in the Activity Bar (left sidebar)
2. Ask Copilot about your project structure:

   #project Explain how this project is structured. What are the main directories and their purposes?

3. Observe the response — Copilot reads your entire workspace to answer. Note the file references it cites.
4. Now ask it about specific code. Type:

   #project What testing framework does this project use? Show me an example test.

5. Try referencing a specific file (replace with an actual file in your project):

   #file:lab1-explore.ts Explain what each function does and suggest improvements.

6. Ask about the model it's using:

   What model are you using right now? What are your capabilities?

7. Try a generation request:

   Generate a TypeScript interface for a User object with id, name, email, createdAt, and an optional avatar URL. Include JSDoc comments.

8. Click the "Insert at Cursor" or "Copy" button on the code block in the response to use the generated code.

Inline Chat

Inline Chat lets you prompt Copilot directly within your editor, right next to your code. It's perfect for targeted edits without leaving your flow.

Instructions

1. In your lab1-explore.ts file, select the calculateTax function you created in Step 1.
2. Open Inline Chat: Cmd+I (macOS) or Ctrl+I (Windows/Linux). A text input appears right in the editor.
3. Type the following prompt and press Enter:

   Refactor to async/await and add input validation for negative numbers

4. Review the diff that appears — additions in green, removals in red.
5. Click Accept to apply the changes, or Discard to revert.
6. Now select the email validation function. Open Inline Chat again (Cmd+I) and type:

   Add unit test cases as comments above this function showing valid and invalid inputs

7. Accept the result.
8. Place your cursor on an empty line (no selection needed). Open Inline Chat and type:

   Create a function that converts Fahrenheit to Celsius with proper TypeScript types

9. Notice that Inline Chat can also generate new code, not just edit existing code.

Model Picker — Compare AI Models

GitHub Copilot supports multiple AI models. Different models have different strengths — speed, reasoning depth, documentation quality, and cost (AI credits usage).

Instructions

1. In the Copilot Chat panel, look for the model selector (dropdown near the input box or in the Chat header). Click it.
2. You should see models such as:
   • GPT-5 mini — Fast, good default for most tasks
   • Claude Sonnet 4.6 — Strong at nuanced explanations and thorough code
   • Gemini 3.1 Pro — Google's model, good at multi-file reasoning
   • GPT-5.5 — OpenAI deep reasoning model, excels at step-by-step logic (7.5x AI credits multiplier)
3. Select GPT-5 mini and ask:

   Write a function that validates a credit card number using the Luhn algorithm. Include edge cases.

4. Note the response time and quality. Copy or remember the output.
5. Switch to Claude Sonnet 4.6 and ask the same question. Compare:
   • Which was faster?
   • Which had more thorough documentation?
   • Which handled more edge cases?
6. Switch to GPT-5.5 and ask the same question. Notice how this model tends to "think" step-by-step and explain its reasoning.
7. If available, try Gemini 3.1 Pro with the same prompt.

Copilot CLI

GitHub Copilot extends to the command line with Copilot CLI. It can suggest shell commands and explain complex commands you encounter.

Instructions

1. Open your terminal (integrated terminal in VS Code works fine).
2. Verify Copilot CLI is installed:

   copilot --version

3. Ask Copilot a question in interactive mode:

   copilot "find all TypeScript files over 200 lines in this project"

4. Copilot will present a suggested command (e.g., using find or wc -l). Review it in ask/execute mode, then choose to run it or refine the request.
5. Now ask Copilot to explain a complex command:

   copilot "explain: git rebase -i HEAD~5"

6. Read the explanation — it breaks down each flag and what the command does. This is invaluable for learning unfamiliar commands.
7. Try a few more prompts:

   copilot "show disk usage of subdirectories sorted by size"
   copilot "list all open ports on this machine"
   copilot "explain: awk '{print $1}' access.log | sort | uniq -c | sort -rn | head -10"

Verify Your Setup

Confirm everything is properly configured before moving on to .

Instructions

1. Visit github.com/settings/copilot in your browser.
2. Verify:
   • Your plan tier (Free, Pro, Pro+, Business, or Enterprise)
   • Suggestions matching public code setting (Allowed or Blocked)
   • Which editor extensions are listed as active
3. Take a screenshot of your settings page for your records.
4. Back in VS Code, check the Copilot status bar icon — it should show active (spinning or checkmark).

• Primary context source for inline suggestions is the current file being edited
• #project scans the entire project; #file targets a specific file
• Inline Chat (Cmd+I) edits in place; Chat panel (Cmd+Shift+I) is conversational
• Copilot supports multiple AI models — no vendor lock-in
• Copilot CLI has two modes: interactive (copilot — ask/execute and plan) and programmatic (copilot -p "prompt")
• For Business/Enterprise plans, code is never used for training