Skip to content

Latest commit

 

History

History
279 lines (198 loc) · 12.5 KB

File metadata and controls

279 lines (198 loc) · 12.5 KB

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:

  • Autonomous execution - Handles multi-step tasks without constant guidance
  • Context awareness - Analyzes your entire workspace to make informed decisions
  • Tool integration - Can create files, run terminal commands, and fix errors automatically
  • Iterative problem solving - Monitors output and adjusts approach as needed
  • Strategic planning - Reasons about tasks and creates implementation plans
  • Multi-file coordination - Works across multiple files and handles complex refactoring
  • Tool confirmation - Requires your approval before invoking tools or running commands (up to 128 tools per request)

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:

  • ✅ How to give high-level instructions to an AI agent
  • ✅ How Agent Mode breaks down complex tasks autonomously
  • ✅ How to iterate and refine solutions with an AI pair programmer
  • ✅ The power of autonomous coding assistance for complete projects
  • ✅ Best practices for prompting Agent Mode effectively

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:

  • 🔍 Analyze the requirements and plan the project structure
  • 📁 Create the necessary files and folders
  • 💻 Write the complete application code with proper structure
  • 📝 Generate comprehensive documentation and comments
  • 🧪 Test the application by running it
  • 🔧 Fix any issues that arise automatically
  • Enhance the solution with additional features

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:

  • Monitor progress: Watch as it creates files, writes code, and tests functionality
  • Provide feedback: "Add more detailed logging to show the calculation steps"
  • Request enhancements: "Can you add a web interface instead of just console?"
  • Ask for explanations: "Explain how the arithmetic progression detection works"

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:

  • ✅ Correctly predicts next number (15) for the sample sequence
  • ✅ Includes magical/fantasy themed output
  • ✅ Handles multiple test sequences
  • ✅ Shows step-by-step reasoning
  • ✅ Stores results in "memories" array
  • ✅ Includes proper error handling
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:

  • Agent Mode will ask for your confirmation before invoking tools or running commands
  • Maximum of 128 tools can be used per request (learn more about MCP tools here)
  • You can interrupt or pause requests at any time
  • Review suggested edits carefully before accepting

Troubleshooting Agent Mode

If Agent Mode isn't working as expected:

Common Issues & Solutions:

🔧 Agent not creating files

  • Check your workspace permissions
  • Ensure you're in a valid project directory
  • Approve file creation when prompted

🔧 Incomplete implementation

  • Your prompt may need more detail - be more comprehensive
  • Add specific success criteria and requirements
  • Include examples of expected behavior

🔧 Tool confirmation needed

  • Agent Mode requires your approval for tool usage
  • Click "Allow" when prompted for file operations
  • Review what tools will be used before approving

🔧 Agent stops mid-task

  • May have hit the 128 tool limit per request
  • Break complex tasks into smaller chunks
  • Continue with a follow-up prompt

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:

  • Start with smaller tasks to get familiar with Agent Mode
  • Be very specific about what "done" looks like
  • Include testing and validation requirements in your prompts

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:

  • Understand complex requirements
  • Plan and execute multi-step solutions
  • Create comprehensive project structures
  • Generate production-quality code
  • Handle testing and documentation automatically

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!