2.1 The tools are chosen for you
Choosing tools can eat a whole weekend. The tools matter less than momentum: the best stack is the one you actually open and use. Today’s is chosen for you, so you can start building now:
| Job | Today’s tool |
|---|---|
| Editor and AI pair programmer | VS Code with GitHub Copilot |
| App framework | Streamlit, which turns a Python file into a web page |
| Live data | The Sectors API, through sectors.py |
| Save points and hosting | Git, GitHub and Streamlit Community Cloud |
2.2 A tour of VS Code
Do it open the starter kit folder in VS Code (File → Open Folder). Find these five areas:
| Area | Where | What you use it for |
|---|---|---|
| Explorer | Left bar, top icon | Open the files in your project |
| Editor | Centre | Read a file |
| Terminal | View → Terminal | Start and stop the app, read errors |
| Source Control | Left bar (Ctrl+Shift+G) |
Save points and GitHub (Module 8) |
| Copilot Chat | Chat icon, title bar | Talk to Copilot, switch modes |
2.3 Ask and Agent
At the bottom of the Copilot Chat box is a picker that sets the mode [VERIFY: the picker’s label and position in the current VS Code]. Today you use two:
| Mode | What it does | Use it when |
|---|---|---|
| Ask | Answers, explains and plans; never changes your files | You want to understand something or plan a feature |
| Agent | Works in several steps: creates and edits files, runs commands, reads errors, tries again | You want something built or changed |
A simple rule: Ask to think, Agent to do. When Agent finishes, it shows what it changed: removed lines in red, added lines in green. You click Keep to accept the changes or Undo to throw them away [VERIFY: Keep / Undo labels]. If Agent asks permission to run a command in the terminal, allow it only if you understand what it does [VERIFY: label of the allow button].
2.4 Try Ask mode
Do it switch Copilot Chat to Ask and send:
I’m brand new to this project. Look at the files and folders in this project and tell me what each one is for, in one short bullet point each. Don’t change anything.
a bullet for each file and folder, including app.py (almost empty) and sectors.py (the helper that gets stock data); no file changed in the Explorer.
2.5 Try Agent mode with a lazy prompt
Now see what Agent does when you give it almost nothing to go on.
Do it click New Chat (+), switch to Agent, and send:
Create a web for investment calculator
Watch it work. It plans, creates one or more files, and may ask to run a command. When it stops, read its summary and answer these questions:
| Question | What Agent probably did |
|---|---|
| Which files did it create or change? | Picked file names itself, maybe even rewrote app.py |
| What does the calculator calculate? | Chose its own formula: savings, a loan, or something else |
| What inputs and currency does it use? | Guessed, often in dollars rather than rupiah |
| What kind of web page is it? | Picked its own tools, maybe plain HTML instead of Streamlit |
something that probably works, built from guesses. Agent made every decision because you made none. Click Undo so your folder is back to how it started.
The lesson: Agent is powerful but cannot read your mind. To make those decisions yourself, you need to know what a web app is made of. That is the next module.