{"slug": "github-copilot-app-for-beginners-using-the-diff-terminal-and-browser", "title": "GitHub Copilot app for Beginners: Using the diff, terminal, and browser", "summary": "GitHub published a beginner's guide to its GitHub Copilot app showing how developers can review agent-generated code using built-in diff, terminal, and browser panels without leaving the app. The diff panel highlights added lines in green and removed lines in red, the terminal panel runs project commands such as `npm run dev` via a Run button, and the browser panel includes a Pick & Polish tool for selecting and adjusting UI elements with the agent. GitHub says the side-by-side panels let users confirm what changed, whether it runs, and whether it works before accepting a change and creating a pull request.", "body_md": "Try using the [GitHub Copilot app >](https://github.com/features/ai/github-app?utm_source=blog-copilot-app-ep6&utm_medium=blog&utm_campaign=copilot-app-for-beginners-series)\n\n# GitHub Copilot app for Beginners: Using the diff, terminal, and browser\n\nChecking agent-generated code usually means hopping between tabs. Learn how to view diffs, run terminal commands, and preview web apps side by side in the GitHub Copilot app.\n\nWhen an agent makes a change to your code, you want to review it, run it, and see what changed. Great news: now you can do all three without having to leave the [GitHub Copilot app](https://github.com/features/ai/github-app?utm_source=blog-copilot-app-ep6&utm_medium=blog&utm_campaign=copilot-app-for-beginners-series).\n\nBefore, doing those three jobs would mean having to bounce between your editor, terminal window, and web browser. But when these steps live side by side as built-in panels in the Copilot app, checking your agent’s work is simple.\n\nLet’s walk through each of the panels in the app and how we’ll use them to complete the AI coding loop.\n\n## Using the diff panel to review changes\n\nThe diff panel (a diff is a before and after comparison) shows exactly what lines were added, removed, or changed, with additions highlighted in green and deletions in red.\n\nThis gives you complete clarity, so you can choose what happens. You can accept changes, leave comments, or ask Copilot to make changes. You’re in complete control and make the final decisions.\n\n## Running commands in the terminal panel\n\nReading code is good, but running it is even better. You can run commands right inside the session from the Copilot app’s terminal panel. And if it looks intimidating, don’t worry. You’re mostly just running the project’s own commands and reading the results.\n\nYou can run the code by hand or configure it as a script (available through the **Run** button). Pretend you’re working on a website, here’s an example of how that works:\n\n- Add the `dev server` script that opens the client folder and then runs`npm run dev` .\n- Click **Run** to start the server for the website.\n\nYou can have multiple terminal windows open at once, so you can switch between them and keep running commands.\n\n## Using the pick & polish tool in the browser panel\n\nFor anything that has a user interface, the browser panel closes the loop. And for our website example: this panel means you can open it and test your new feature as if you were using the site.\n\nIf you want to keep iterating, you can use the **Pick & Polish** tool to select an element and adjust it with the agent.\n\nAnd to see what got fixed, you can run the `dev server` script again after you’ve made changes.\n\n## Closing the loop of reviewing AI code\n\nNow you’ve reviewed the diff, started the project in the terminal, reviewed it in the browser, and iterated to get it to a working feature. Once you’ve gotten it where you want, you can accept the change directly from the Copilot app and create a pull request. Completing this loop from one place means there’s no tab hopping, switching apps, or losing your place.\n\nHaving review, run, and preview side by side is what makes agent-made changes feel safe instead of scary, because you can prove that what you’re merging works.\n\n## Take this with you\n\nThese built-in panels answer three important questions you should always ask before you accept an agent’s work.\n\n- What’s changed?\n- Does it run?\n- And does it *actually*  work?\n\nRunning through this list before accepting agent-generated code will help you understand what changed and whether it functions the way you want, keeping you in control. ✨\n\n## Tags:\n\n## Written by\n\n## Related posts\n\n### \n\t\t\t\t\t[Project HydraFusion: Frontier quality via multi-model orchestration](https://github.blog/ai-and-ml/github-copilot/project-hydrafusion-frontier-quality-via-multi-model-orchestration/)\t\t\t\t\n\nIn controlled offline evaluations, HydraFusion’s selective coding workflows matched or exceeded the evaluated Opus 5 baseline while reducing estimated workflow cost. Now available as a research preview in GitHub Copilot.\n\n### \n\t\t\t\t\t[GitHub Copilot app for Beginners: Run several agents at once](https://github.blog/ai-and-ml/github-copilot/github-copilot-app-for-beginners-run-several-agents-at-once/)\t\t\t\t\n\nLearn how to run parallel agents in the GitHub Copilot app, and experience the moment it stops feeling scary and starts feeling powerful.\n\n### \n\t\t\t\t\t[Decoding the new AI lingo: Loops, harnesses, squads, hill climbing… oh my!](https://github.blog/ai-and-ml/decoding-the-new-ai-lingo-loops-harnesses-squads-hill-climbing-oh-my/)\t\t\t\t\n\nFrom loop engineering to harnesses, squads, and open weights, the GitHub Podcast breaks down the AI terms showing up in developer conversations.", "url": "https://wpnews.pro/news/github-copilot-app-for-beginners-using-the-diff-terminal-and-browser", "canonical_source": "https://github.blog/ai-and-ml/github-copilot/github-copilot-app-for-beginners-using-the-diff-terminal-and-browser/", "published_at": "2026-09-10 21:31:19+00:00", "updated_at": "2026-09-10 21:43:13.591461+00:00", "lang": "en", "topics": ["ai-products", "ai-tools", "ai-agents", "developer-tools", "artificial-intelligence"], "entities": ["GitHub", "GitHub Copilot", "Pick & Polish", "npm"], "alternates": {"html": "https://wpnews.pro/news/github-copilot-app-for-beginners-using-the-diff-terminal-and-browser", "markdown": "https://wpnews.pro/news/github-copilot-app-for-beginners-using-the-diff-terminal-and-browser.md", "text": "https://wpnews.pro/news/github-copilot-app-for-beginners-using-the-diff-terminal-and-browser.txt", "jsonld": "https://wpnews.pro/news/github-copilot-app-for-beginners-using-the-diff-terminal-and-browser.jsonld"}}