CopilotAdventures

GitHub Copilot Agent Mode Warmup Adventure

GitHub Copilot Agent Mode is an autonomous AI pair programmer that can understand complex tasks and break them down into multiple steps, creating entire applications from scratch! In this warmup adventure, you’ll discover the power of Agent Mode and learn how to work with an AI assistant that can think, plan, and execute multi-step coding tasks.

What makes Agent Mode special:

If you’re brand new to GitHub Copilot, check out this content to learn about the foundational features of GitHub Copilot agent mode:

Getting Started: Setting Up GitHub Copilot Agent Mode

Prerequisites

Before starting this adventure, you’ll need to perform the following steps:

  1. Install VS Code - Download from VS Code.
  2. Set up GitHub Copilot in VS Code - Follow the instructions at Set up GitHub Copilot in VS Code.

Starting Agent Mode

  1. Open VS Code
  2. Open the Chat panel - Select the GitHub Copilot icon in the top bar or use Ctrl+Alt+I / ⌃⌘I.
  3. Select “Agent” mode from the dropdown at the bottom of the Chat panel.

Learning Outcomes

By completing this adventure with Agent Mode, you’ll learn:

Your First Agent Mode Adventure: The Chamber of Echoes

Let’s experience the power of autonomous AI programming!

Background:

Perched atop the highest hill, overlooking the kingdom, stands the majestic Echo Castle. Within its stone walls is a chamber known as the Echo Room. This chamber, unlike any other, has the mystic power to echo numbers to anyone who enters. However, the Echo Room doesn’t just echo back any numbers; it always echoes the next number in a sequence.

Legends tell of a wizard who enchanted this chamber to test the intellect of visitors. The room would echo numbers in sequence, and only those who could predict the next echo were deemed worthy of the castle’s hidden treasures.

Objective:

Your task is to have GitHub Copilot Agent Mode create a complete application that can enter the Echo Room, listen to its sequence, and predict the next number it will echo. Unlike traditional step-by-step coding, Agent Mode will understand your high-level goal and autonomously build the entire solution.

Using Agent Mode to Solve the Echo Chamber Challenge

Step 1: Give Agent Mode a Comprehensive Task

In the Chat panel with “Agent” mode selected, provide a detailed prompt like the following. This prompt uses JavaScript and Node.js, but you can adapt it to your preferred language.

I need you to create a complete Echo Chamber application that solves a magical number sequence prediction puzzle. Here are the requirements:

**Project Setup:**
1. Use JavaScript and Node.js for the implementation
2. Create a new directory at the root of the "CopilotAdventures" directory called "echo-chamber" and a file named "index.js" inside of it
3. Include proper documentation and comments in the code you generate

**Core Functionality:**
1. Create a sequence predictor for arithmetic progressions
2. Start with the sample sequence: [3, 6, 9, 12]
3. Predict the next number in the sequence (should output 15 if done correctly)
4. Store the "memories" of previous echoes in an array

**Enhanced Features:**
1. Add input validation to ensure sequences are valid arithmetic progressions
2. Create a user-friendly console interface that explains the Echo Room story
3. Add the ability to test multiple sequences
4. Include error handling for edge cases
5. Generate comprehensive documentation

**Testing:**
1. Test the application with the provided sequence
2. Create additional test cases with different arithmetic progressions
3. Verify error handling works correctly

Please create the complete project structure, implement all functionality, test it thoroughly, and provide clear documentation on how to run it.

Step 2: Watch Agent Mode’s Autonomous Workflow

Agent Mode will autonomously:

You’ll see each step transparently in the UI, showing every tool invocation and decision.

Step 3: Interact and Refine

As Agent Mode works, you can:

Step 4: Explore Advanced Capabilities

Once your basic Echo Chamber is working, try asking Agent Mode to:

Enhance the Echo Chamber application with these advanced features:

1. **Multi-Pattern Support**: Extend beyond arithmetic progressions to handle geometric progressions and polynomial sequences
2. **Web Interface**: Create a beautiful HTML/CSS/JavaScript interface with an Echo Castle theme
3. **Sequence Visualization**: Add charts or graphs to visualize the sequences
4. **Historical Analysis**: Track and analyze multiple sequences over time
5. **Advanced Testing**: Create a comprehensive test suite with edge cases
6. **Performance Optimization**: Optimize for handling large sequences efficiently
7. **Documentation Website**: Generate a complete documentation site explaining the mathematics

Make it production-ready with proper error handling, logging, and user experience.

Expected Output Example

When your Agent Mode implementation is complete, running the application should produce output similar to the following. AI is non-deterministic, so your results may vary slightly, but the structure should be similar.

🏰 Welcome to the Echo Chamber of Echo Castle! 🏰

The magical chamber echoes with ancient wisdom...
Analyzing the sequence: [3, 6, 9, 12]

🔮 Detecting pattern...
   - Common difference found: 3
   - Sequence type: Arithmetic Progression
   - Pattern confirmed: Each number increases by 3

🔊 The chamber echoes the next number: 15

📚 Storing in magical memories: [3, 6, 9, 12, 15]

✨ The treasure of Echo Castle is revealed! ✨
   You have successfully predicted the chamber's echo!

🧪 Testing with additional sequences:

Test 1: [5, 10, 15] → Next: 20
Test 2: [100, 90, 80, 70] → Next: 60
Test 3: [1, 4, 7, 10, 13] → Next: 16

Verification Checklist:

Ask Mode Agent Mode
Line-by-line suggestions Complete project creation
Manual file management Automatic project structure
User drives each step Autonomous task execution
Code completion End-to-end solutions
Reactive assistance Proactive problem solving
Single-file focus Multi-file coordination

Advanced Agent Mode Tips

Effective Prompting Strategies

  1. Be Comprehensive: Provide complete context and all requirements upfront
  2. Specify Quality Standards: Ask for production-ready code with proper error handling
  3. Define Success Criteria: Clearly state what “done” looks like
  4. Request Documentation: Ask for comprehensive docs and comments
  5. Include Testing Requirements: Specify testing and validation needs

Leveraging Agent Mode’s Strengths

  1. Complex Project Bootstrapping: Let Agent Mode create entire project structures
  2. Multi-technology Integration: Ask it to combine different tools and frameworks
  3. Comprehensive Documentation: Request full documentation generation
  4. Testing Automation: Have it create and run comprehensive test suites
  5. Iterative Enhancement: Build features incrementally through conversation

Important Agent Mode Considerations

Tool Confirmation & Limits:

Troubleshooting Agent Mode

If Agent Mode isn’t working as expected:

Common Issues & Solutions:

🔧 Agent not creating files

🔧 Incomplete implementation

🔧 Tool confirmation needed

🔧 Agent stops mid-task

Setup Verification:

  1. Check Prerequisites: Ensure you’re using a recent version of VS Code
  2. Mode Selection: Make sure “Agent” is selected in the Chat dropdown
  3. Authentication: Ensure you’re signed in to GitHub with Copilot access
  4. Clear Instructions: Provide detailed and specific requirements
  5. Tool Permissions: Approve tool usage if prompted (assuming you trust the tools)

Pro Tips:

Echo Castle’s Hidden Treasure is Now Yours!

You’ve completed your first GitHub Copilot Agent Mode adventure! You’ve experienced the power of autonomous AI programming that can:

What’s Next?

Now that you’ve mastered Agent Mode basics:

  1. Try More Adventures: Explore other adventures using Agent Mode
  2. Real-world Projects: Use Agent Mode to bootstrap your actual development projects
  3. Experiment with Integration: Try combining Agent Mode with different frameworks and tools
  4. Share Your Experience: Provide feedback to help improve Agent Mode capabilities

Check out the other adventures located in the Adventures/Agent folder to see more ways GitHub Copilot agent mode can enhance your development workflow!

Remember: Agent Mode is your autonomous development partner. Give it clear goals, let it work, and iterate together to build incredible software solutions!