diff --git a/.github/steps/3-copilot-edits.md b/.github/steps/3-copilot-edits.md index cbdab70..c9be35c 100644 --- a/.github/steps/3-copilot-edits.md +++ b/.github/steps/3-copilot-edits.md @@ -95,7 +95,7 @@ Let's use Copilot to change the website to display signed up students under each 1. With our new feature complete, please **commit** and **push** the changes to GitHub. -1. Wait a moment for Mona to check your work, provide feedback, and share the final lesson. Almost done! +1. Wait a moment for Mona to check your work, provide feedback, and share the next lesson.
diff --git a/.github/steps/4-copilot-agent-mode.md b/.github/steps/4-copilot-agent-mode.md index 41644ef..acdaac5 100644 --- a/.github/steps/4-copilot-agent-mode.md +++ b/.github/steps/4-copilot-agent-mode.md @@ -1,49 +1,50 @@ -### :keyboard: Bonus Activity - GitHub Copilot Agent Mode - -> 🪧 **Note:** This bonus activity is optional and not graded. +## Step 4: Engage Hyperdrive - Copilot Agent Mode 🚀 ### 📖 Theory: What is Copilot Agent Mode? -Copilot **Agent Mode** extends beyond single-pass edits: it can plan, execute, inspect results (including build/terminal output), and iteratively refine its own work without you re‑prompting each micro-step. - -**How it differs from Edit Mode** (at a glance): - -| Ask / Inline Chat | Edit Mode | Agent Mode | -| ------------------- | ------------------------------- | --------------------------------------- | -| One answer/snippet | Multi‑file patch (single cycle) | Multi‑step adaptive workflow | -| You curate context | You supply context files | Agent may add/read files & run commands | -| No self‑review loop | Minimal implicit review | Explicit feedback & retry loop | +Copilot [agent mode](https://code.visualstudio.com/docs/copilot/chat/chat-agent-mode) is the next evolution in AI-assisted coding. Acting as an autonomous peer programmer, it performs multi-step coding tasks at your command. -#### Key capabilities +Copilot Agent Mode responds to compile and lint errors, monitors terminal and test output, and auto-corrects in a loop until the task is completed. -- Feedback loop: can detect errors or incomplete changes and attempt fixes automatically. -- Multi-step reasoning: chains several edit + verify cycles toward a broader goal. -- Tool usage: may run commands / examine terminal output (depending on your environment & permissions). -- Cross-file consistency: attempts to coordinate backend + frontend or related modules. +#### Edit Mode vs Agent Mode (at a glance) -#### Good use cases +| Aspect | ✏️ Edit Mode | 👩‍🚀 Agent Mode | +| -------------- | --------------------------------- | -------------------------------------------------------------------------------- | +| Context scope | Only the files you explicitly add | May read/add additional files & surfaces as needed | +| Self‑review | Minimal (you drive iteration) | Built‑in feedback & retry loop on errors/failures | +| Change scope | Highly scoped & surgical | Broader; may touch related layers for consistency | +| When to choose | You know exactly what to change | Goal is broader or uncertain; requires exploration | +| Tool calling | None (you run commands manually) | Can invoke tools (read/edit files, run commands, inspect terminal & test output) | -- Coordinated refactors (model + route + tests) -- Adding “glue” code across layers -- Resolving a bug that requires reading logs or compiler errors +#### 🧰 Agent Mode Tools -#### Limitations / cautions +Agent mode uses tools to accomplish specialized tasks while processing a user request. Examples of such tasks are: -- Can produce more changes than you expect—always review the diff before keeping. -- Longer runs may drift; give it concise, outcome-focused follow-ups (“The API returns 500; inspect server logs and fix”). -- Side-effectful commands (like installing services) may fail or leave partial state—treat them as experiments. +- Finding relevant files to complete your prompt +- Fetching contents of a webpage +- Running tests or terminal commands -> 💡 **Tip:** If Agent Mode starts to feel “lost,” stop, accept/undo what’s useful, and start a fresh Agent session with a clearer goal. +> [!TIP] +> While VS Code provides many built‑in tools you can also provide Agent Mode more domain‑specific powers through **MCP tools**. +> +> Read more on [MCP servers](https://code.visualstudio.com/docs/copilot/customization/mcp-servers) and [GitHub MCP Server](https://github.com/github/github-mcp-server) Now, let's give **Agent Mode** a try! 👩‍🚀 ### :keyboard: Activity: Use Agent mode to add functional "unregister" buttons -Let's experiment with some more open-ended requests that will add more functionality to our web application. Remember, AI assistants often produce different results, even if the same prompt is provided. If you don't get the desired results, you can try other models or provided followup feedback to refine the results. +Let's experiment with some more open-ended requests that will add more functionality to our web application. + +If you don't get the desired results, you can try other models or provided followup feedback to refine the results. 1. Open the **Copilot** chat panel and use the dropdown menu to switch to **Agent** mode. - image + agent mode + +1. Click on the **Tools** icon and explore all Tools currently available to Copilot Agent Mode. + + tools icon + 1. Time for our test! Let's ask Copilot to add functionality for removing participants. @@ -54,8 +55,10 @@ Let's experiment with some more open-ended requests that will add more functiona > When clicked, it will unregister that participant from the activity. > ``` - - If you try this prompt in **Edit** mode, you will probably find that the changes to the frontend and backend were made in a theoretical way. Although no syntax or runtime errors occurred, the changes were not compatible and didn't achieve the goal. - - In **Agent** mode, Copilot reviewed its own work and refined it to ensure all changes were error free and coordinated together. + The `#codebase` tool is used by Copilot to find relevant files, code chunks that are relevant to the task at hand. + + > 🪧 **Note:** In this lab we explicitly include the `#codebase` tool to get the most repeatable results. + > Feel free to try the prompt **without** `#codebase` and observe whether Agent Mode decides to gather broader project context on its own. 1. When Copilot is finished, restart the debugger and inspect the results. If you like the results, press the **Keep** button. If not, try providing Copilot some feedback to refined the results. @@ -64,48 +67,29 @@ Let's experiment with some more open-ended requests that will add more functiona > ![Static Badge](https://img.shields.io/badge/-Prompt-text?style=social&logo=github%20copilot) > > ```prompt - > #codebase I've noticed there seems to be a bug. + > I've noticed there seems to be a bug. > When a participant is registered, the page must be refreshed to see the change on the activity. > ``` - - If you try this prompt in **Edit** mode, it may or may not work. - 1. When Copilot is finished, inspect the results. If you like the results, press the **Keep** button. If not, try providing Copilot some feedback. -### :keyboard: Activity: Use Agent mode to change the database! 🧑‍🚀 +### :keyboard: Activity: Use Agent mode to get test coverage 🧑‍🚀 -Just for fun, let's try something even more difficult and open-ended to see what happens! +Your backend is now feature‑rich—but still has zero test coverage. Use Copilot **Agent Mode** to add test dependencies, scaffold starter tests and run them. -> [!TIP] -> In our experiments, we got working results most of the time, but not every time. -> You might try other models or pausing to provide Copilot feedback. - -1. (optional) If it is available for you, you might try another model such as `Claude 3.5 Sonnet`. - - image +1. Ask Copilot in **Agent mode** to set up and run tests for your backend. -1. Ask Copilot to install a local database service. - - > ![Static Badge](https://img.shields.io/badge/-Prompt-text?style=social&logo=github%20copilot) + > ![Static Badge](https://img.shields.io/badge/-Prompt-placeholder?style=social&logo=github%20copilot) > > ```prompt - > Please install a local mongodb server for development reasons. - > Afterward, run a command that lists the collections to verify the service is active and working. - > Do not modify our program yet. + > Add fastapi tests using pytest in a new tests directory and run them. + > Make sure to add any new dependencies to requirements.txt > ``` - - We purposely made the default development environment not ready for installing a local MongoDB server. - - You will see Copilot make mistakes, analyze the error messages, and ask to run various extra commands to make the environment suitable. Nice! +1. As Copilot works on your prompt, different tools might need your approval. -1. Ask Copilot to change our app to use the database service. 🤯 + **🎯 Goal: Get all tests passing (green) — aim for a clean run! ✅** - > ![Static Badge](https://img.shields.io/badge/-Prompt-text?style=social&logo=github%20copilot) - > - > ```prompt - > #codebase I don't like that we are storing the data in memory. - > Let's switch to using mongodb. - > For now use the local development instance. - > Please pre-populate the database with the existing hardcoded json activities, keeping the activity name as the key. - > ``` + > 🪧 **Note:** Copilot may one-shot this with the initial prompt or need more guidance from you. -1. That's your preview for now. We hope it was fun and please check back soon on the [Skills page](https://skills.github.com) for a dedicated exercise to explore even more of Agent Mode! 🧑‍🚀 🚀 +1. Once the tests are passing - **commit** and **push** all changes to your `accelerate-with-copilot` branch to progress to the last step! Almost done! diff --git a/.github/steps/5-copilot-on-github.md b/.github/steps/5-copilot-on-github.md index 6be015d..d17fc79 100644 --- a/.github/steps/5-copilot-on-github.md +++ b/.github/steps/5-copilot-on-github.md @@ -1,7 +1,9 @@ -## Step 4: Using GitHub Copilot within a pull request +## Step 5: Using GitHub Copilot within a pull request Congratulations! You are finished with coding for this exercise (and VS Code). Now it's time to merge our work. :tada: To wrap up, let's learn about two limited-access Copilot features that can speed up our pull requests! +### 📖 Theory: GitHub Copilot for pull requests + #### Copilot pull request summaries Typically, you would review your notes and commit messages then summarize them for your pull request description. This may take some time, especially if commit messages are inconsistent or code is not documented well. Fortunately, Copilot can consider all changes in the pull request and provide the important highlights, and with references too! @@ -26,9 +28,9 @@ Both **Copilot pull request summaries** and **Copilot code review** have limited - **base:** `main` - **compare:** `accelerate-with-copilot` - - **title:** `Add registration validation and more activities` + - **title:** `Improve student activity registration system` -1. (Optional) In the **Add a description** area, enter edit mode if needed, then click the **Copilot actions** icon and **Summary** action. After a moment, Copilot will add a description. :memo: +1. (Optional) In the PR description toolbar click the **Copilot** icon and **Summary** action. After a moment, Copilot will add a description based on your changes. :memo: Copilot summarize button diff --git a/.github/steps/x-review.md b/.github/steps/x-review.md index e029f79..7e1bc55 100644 --- a/.github/steps/x-review.md +++ b/.github/steps/x-review.md @@ -4,15 +4,17 @@ _Congratulations, you've completed this exercise and learned a lot about GitHub celebrate -Here's a recap of your accomplishments: +Here's a recap of the GitHub Copilot features you learned: - -- Set up your GitHub Codespace and environment. -- Learned how to use Copilot inline suggestions, Chat, and Edits. -- Used Copilot to generate commit messages and pull request summaries. -- Learned how to request Copilot to review your code. +- **Ask Mode**: Used @workspace to explore and understand your codebase +- **Inline suggestions**: Completed code with Tab acceptance +- **Inline Chat**: Generated code and data with Ctrl/Cmd + I +- **Edit Mode**: Made multi-file changes with targeted prompts +- **Agent Mode**: Built features and tests autonomously +- **GitHub integration**: Generated commit messages, PR summaries, and code reviews ### What's next? + - Check out the other [GitHub Skills exercises](https://learn.github.com/skills). - Learn how to [Integrate MCP with Copilot](https://github.com/skills/integrate-mcp-with-copilot) to give Copilot extra capabilities! - Tailor Copilot to your project needs in [Customize your GitHub Copilot Experience](https://github.com/skills/customize-your-github-copilot-experience) diff --git a/.github/workflows/1-preparing.yml b/.github/workflows/1-preparing.yml index 1717df5..dd57c15 100644 --- a/.github/workflows/1-preparing.yml +++ b/.github/workflows/1-preparing.yml @@ -1,4 +1,4 @@ -name: Step 1 # Preparing to make your extension +name: Step 1 on: push: @@ -99,10 +99,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v4 + uses: actions/checkout@v5 - name: Get response templates - uses: actions/checkout@v4 + uses: actions/checkout@v5 with: repository: skills/exercise-toolkit path: exercise-toolkit diff --git a/.github/workflows/2-first-introduction.yml b/.github/workflows/2-first-introduction.yml index 412f3f2..5335f6d 100644 --- a/.github/workflows/2-first-introduction.yml +++ b/.github/workflows/2-first-introduction.yml @@ -1,5 +1,4 @@ -name: Step 2 # Copilot chat - +name: Step 2 on: push: branches: @@ -96,10 +95,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v4 + uses: actions/checkout@v5 - name: Get response templates - uses: actions/checkout@v4 + uses: actions/checkout@v5 with: repository: skills/exercise-toolkit path: exercise-toolkit diff --git a/.github/workflows/3-copilot-edits.yml b/.github/workflows/3-copilot-edits.yml index 14955e4..1686627 100644 --- a/.github/workflows/3-copilot-edits.yml +++ b/.github/workflows/3-copilot-edits.yml @@ -1,4 +1,4 @@ -name: Step 3 # Copilot edits +name: Step 3 on: push: @@ -106,10 +106,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v4 + uses: actions/checkout@v5 - name: Get response templates - uses: actions/checkout@v4 + uses: actions/checkout@v5 with: repository: skills/exercise-toolkit path: exercise-toolkit diff --git a/.github/workflows/4-copilot-agent-mode.yml b/.github/workflows/4-copilot-agent-mode.yml index 26c0497..dd11dee 100644 --- a/.github/workflows/4-copilot-agent-mode.yml +++ b/.github/workflows/4-copilot-agent-mode.yml @@ -1,11 +1,9 @@ -name: Step 4 # Copilot Agent Mode +name: Step 4 on: push: branches: - "accelerate-with-copilot" - paths: - - "src/static/**" permissions: contents: read @@ -20,9 +18,89 @@ jobs: name: Find Exercise Issue uses: skills/exercise-toolkit/.github/workflows/find-exercise-issue.yml@v0.7.0 + check_step_work: + name: Check step work + runs-on: ubuntu-latest + needs: [find_exercise] + env: + ISSUE_REPOSITORY: ${{ github.repository }} + ISSUE_NUMBER: ${{ needs.find_exercise.outputs.issue-number }} + + steps: + - name: Checkout + uses: actions/checkout@v5 + + - name: Get response templates + uses: actions/checkout@v5 + with: + repository: skills/exercise-toolkit + path: exercise-toolkit + ref: v0.7.0 + + - name: Find last comment + id: find-last-comment + uses: peter-evans/find-comment@v3 + with: + repository: ${{ env.ISSUE_REPOSITORY }} + issue-number: ${{ env.ISSUE_NUMBER }} + direction: last + + - name: Update comment - checking work + uses: GrantBirki/comment@v2.1.1 + with: + repository: ${{ env.ISSUE_REPOSITORY }} + issue-number: ${{ env.ISSUE_NUMBER }} + comment-id: ${{ steps.find-last-comment.outputs.comment-id }} + file: exercise-toolkit/markdown-templates/step-feedback/checking-work.md + edit-mode: replace + + # START: Check practical exercise + + - name: Check for pytest keyphrase in requirements.txt + id: check-for-pytest + continue-on-error: true + uses: skills/action-keyphrase-checker@v1 + with: + text-file: requirements.txt + keyphrase: pytest + + - name: Check if tests directory exists + id: check-tests-dir + continue-on-error: true + run: | + if find . -name "tests" -type d | grep -q .; then + echo "Tests directory found" + exit 0 + else + echo "Tests directory not found" + exit 1 + fi + + - name: Update comment - step results + uses: GrantBirki/comment@v2.1.1 + with: + repository: ${{ env.ISSUE_REPOSITORY }} + issue-number: ${{ env.ISSUE_NUMBER }} + comment-id: ${{ steps.find-last-comment.outputs.comment-id }} + edit-mode: replace + file: exercise-toolkit/markdown-templates/step-feedback/step-results-table.md + vars: | + step_number: 4 + results_table: + - description: "Checked for pytest in requirements.txt" + passed: ${{ steps.check-for-pytest.outcome == 'success' }} + - description: "Checked if tests are added in a separate directory" + passed: ${{ steps.check-tests-dir.outcome == 'success' }} + + # END: Check practical exercise + + - name: Fail job if not all checks passed + if: contains(steps.*.outcome, 'failure') + run: exit 1 + post_next_step_content: name: Post next step content - needs: [find_exercise] + needs: [find_exercise, check_step_work] runs-on: ubuntu-latest env: ISSUE_REPOSITORY: ${{ github.repository }} @@ -30,10 +108,10 @@ jobs: steps: - name: Checkout - uses: actions/checkout@v4 + uses: actions/checkout@v5 - name: Get response templates - uses: actions/checkout@v4 + uses: actions/checkout@v5 with: repository: skills/exercise-toolkit path: exercise-toolkit @@ -53,7 +131,7 @@ jobs: with: repository: ${{ env.ISSUE_REPOSITORY }} issue-number: ${{ env.ISSUE_NUMBER }} - file: ${{ env.STEP_4_FILE }} + file: ${{ env.STEP_5_FILE }} - name: Create comment - watching for progress uses: GrantBirki/comment@v2.1.1 diff --git a/.github/workflows/5-copilot-on-github.yml b/.github/workflows/5-copilot-on-github.yml index 71abd54..84b546f 100644 --- a/.github/workflows/5-copilot-on-github.yml +++ b/.github/workflows/5-copilot-on-github.yml @@ -1,4 +1,4 @@ -name: Step 5 # Copilot on GitHub +name: Step 5 on: pull_request: @@ -61,7 +61,7 @@ jobs: finish_exercise: name: Finish Exercise needs: [find_exercise, post_review_content] - uses: skills/exercise-toolkit/.github/workflows/finish-exercise.yml@v0.7.0 + uses: skills/exercise-toolkit/.github/workflows/finish-exercise.yml@v0.7.1 with: issue-url: ${{ needs.find_exercise.outputs.issue-url }} exercise-title: "Getting Started with GitHub Copilot" diff --git a/pytest.ini b/pytest.ini new file mode 100644 index 0000000..aaf283f --- /dev/null +++ b/pytest.ini @@ -0,0 +1,2 @@ +[pytest] +pythonpath = .