Final project work · learning-journey kickoff · browser extensions with Claude Code
Agenda Slides Open fullscreen ↗
Open slides ↗Post-Class Notes
TL;DR
We built a Chrome extension live, from an empty folder to a working thing loaded in the browser, without writing a line of code by hand. The extension took about twenty minutes. What took the rest of the class was everything around it: reading the spec the agent wrote, being suspicious of the tests it wrote for itself, making it tell me what it had decided on its own, and then telling it what was still wrong. The habit to keep: the interesting work starts after the code runs. Your deployed project URL is due Wednesday, 7/22 at 10:00 AM, before class, or you are not on the voting ballot.
What we did today
- Three lightning talks, the last of the semester: why Gemini 3.5 Pro keeps slipping its ship date, China's new rules shutting down AI companion apps, and AI predicting chemical toxicity.
- A live build of a Chrome extension with Claude Code: empty folder to loaded-and-working, including one design iteration.
- A walk through what it takes to actually publish an extension to the Chrome Web Store.
- The learning journey exercise, assigned for this week.
A browser extension is a folder
This is the part worth remembering, because it makes the whole category stop looking like magic.
An extension is a folder with HTML, CSS, and JavaScript in it. That is the entire semester. The one new thing is a file called manifest.json, which is the extension telling Chrome what it is: a name, a version, which sites it runs on, and which files to load. Chrome now uses Manifest V3, and if you ask an AI for extension code you should check that what comes back says "manifest_version": 3. Older answers exist and they no longer load.
To try one: go to chrome://extensions, turn on Developer mode, click Load unpacked, and pick the folder that contains manifest.json. That is it. No store, no signup, no build step. You can put an extension in your own browser in under a minute.
The reason to care: think about the thing you do every week that annoys you in a browser. A page that buries the information you want. A site that makes you count something by hand. A tab you always open right after another one. Most of those are an extension, and most of those are smaller than your final project.
What actually happened during the build
The first thing the agent produced was not code. I asked it for two documents before anything else. A PRD.md, a product requirements document, saying what the extension was for, who would use it, and what it would do in version one. Then a CLAUDE.md, which is a different animal: not what to build, but how to build it, the rules and guardrails for the agent itself.
Only the second one is a real convention. CLAUDE.md is a file the tool reads at the start of every session, so anything you put there is a standing instruction. The PRD is just a habit of mine, and a good one to steal.
That order matters. In class I said something I want to repeat here: these days I do not read much of the code any more, but I do read that document very carefully. An agent will write more files in three minutes than you can keep track of, and you are not going to review all of them. You can review the one page that says what it thinks it is building. If the spec is wrong, everything downstream is wrong, and you find out much later.
It got stuck, and I interrupted it. A set of tools was loading and it hung. Escape key, then a new instruction: skip all of that, just write the two documents. Nothing broke. An agent is a process you can stop and redirect, and being willing to interrupt it is a real skill. The alternative is sitting there watching a spinner, hoping.
It tested its own work, and the tests were green. It also reported checking six live Wikipedia pages. Be careful with what that means. The agent wrote those tests, so passing them says the code does what the agent decided to test for. It says nothing about whether the agent decided to test for the right things.
Today proved the point in the same breath. Alongside the green tests it reported one choice it had made on its own: it was counting HTML comments as words. That is wrong. Comments are invisible to a reader, so counting them inflates the reading time. Every test passed and the behaviour was still incorrect.
Ask it to tell you what it decided. That report is not something the tool owes you automatically, and it will often not appear. So ask for it, every time:
When you finish, list every decision you made that I did not specify.
Better, put it in your CLAUDE.md once and stop repeating yourself:
## Reporting
At the end of every task, list any choice you made that I did not explicitly ask for.That is the same trick as the line I showed you in my own CLAUDE.md, the one that makes it start every reply with my name. You do not hope for the behaviour you want. You write it down as a standing instruction and then you can tell when it stops following instructions.
Commit before you let it run. This is the one I most want you to take into the next four days, and we did not do it in class today, because I started in an empty folder with nothing to lose. You are not starting from nothing. git add -A and git commit before you hand an agent your final project, every time. Then if the run goes sideways, git checkout . puts everything back in a second, and you can read exactly what it changed with git diff instead of guessing. Agents are much less frightening when undo is one command away.
Then the real work started. The extension worked on the first try, and it looked bad. The reading time was there and you would never notice it. So: this is showing up, but it is not obvious enough for a user. Four design options came back, the class picked one, reload, visibly better.
That loop is the job. Getting it to run is the easy half now. Deciding what is still wrong, saying it precisely, and iterating is where your judgment shows up, and it is exactly what you will be doing on your final project for the next four days. For something you build for other people, that loop should include the other people: show it to them, watch where they get confused, change it.
Agents run their own side quests. Asked for an icon, it did not go find one. It wrote a small program to generate one, ran it, and checked all the required sizes. The icon was mediocre and it was a starting point. Worth noticing that a coding agent's output is not always code.
It costs real money. Every one of these tools meters what you use, whether you are on a paid plan or a free tier, and a session like today's is not cheap. If you are paying for one, use the features you are paying for.
What it takes to publish one
We walked the path but did not finish it, and it is worth knowing what is between you and a real listing:
- An icon, in several sizes.
- A name that does not collide with somebody's trademark. The agent flagged this on the first name we tried.
- The folder zipped.
- A privacy policy URL, even for an extension that collects nothing.
- A one-time five dollar developer registration fee.
I have published one, a tool that finds Reddit and Hacker News discussions of whatever article you are reading and summarizes them. It went through many rounds of fixes. It has one user, and the user is me. That is a completely normal outcome and it was still worth building.
From the lightning talks
The bottleneck has moved from speed to reliability. A company generating a large share of its new code with AI still scrapped a flagship model and rebuilt it rather than ship something that failed on the tasks it was meant to be good at. The question the talk closed on is a good one to carry: would you rather ship something on the edge, or something late but solid?
Alignment. This came up from the talk about AI companion apps being shut down. Alignment is the work done after a model is trained to keep it from answering in ways that hurt people. A model that has finished training can answer anything; alignment is what makes it decline, or redirect, or hand you a crisis line instead. It is a large and genuinely difficult part of building these systems, and if you go on to work near AI you will hear the word constantly.
AI for science. The chemical toxicity talk pointed at something bigger. There is now a research journal for almost every combination of AI and some other field. If you are looking for a startup idea rather than a class project, the intersections are where the unclaimed ground is.
The extensions you use
From the chat survey, since a few of you asked what everybody said: Grammarly, the Claude extension, uBlock Origin and other ad blockers, Nord VPN, and Capital One Shopping. Mine is Keepa, which draws the price history of anything on Amazon so you can see whether a sale is actually a sale.
Worth a look
- Browser extensions and coding agents and your repo, the two decks behind today.
- Today's session slides.
- Chrome's own extension tutorial, if you want to build one over the break. Start with the hello-world and change one thing.
- MDN on browser extensions, which covers Firefox and Chrome together.
Before next class
- Submit your deployed final project URL by Wednesday 10:00 AM. It is worth 10 points, taken out of the final project total. This is the one that blocks everything else: your project has to be on the awards ballot before class starts, and it cannot be if I do not have the link. As of today, one of you has submitted it.
- Get your project demo-ready. Deployed, live, working end to end. You present it Wednesday and presenting is required.
- Build your
learning-journey.html. Point AI at yourlogs/folder, ask it to find the arc across the semester, and have it build one page telling that story. Any format works: a timeline, a before and after, a skill map. It goes in your oim3690 course repo, not a new one, and it needs some kind of visual rather than only paragraphs. Then edit the parts that do not sound like you. This one is a gift to yourself, so it is worth twenty minutes of making it look right. - Write
logs/wk10.md, then add it to your learning journey page so the last week is in there too. - Checkpoint 5 is due Friday, 7/24. It checks all ten weekly logs, your
learning-journey.html, and that your repo is clean.
Next class is Wednesday, 7/22, and it is the last one. Final project demos, the awards vote, and the wrap-up. Final submission is Friday, 7/24, so you still have two days of polish after you present.