Updated June 2026
If you’ve got an AI coding agent set up (Claude Code, Cursor, or similar) and want to actually practice with it, here are five real projects ranging from “weekend afternoon” to “a few evenings” — each one teaches a different useful pattern.
⚡ Quick overview
- Each project below is self-contained — finish one before starting the next.
- Focus on the pattern each project teaches, not just the finished result.
The 5 projects
| Project | Difficulty | What it teaches |
|---|---|---|
| 1. Personal expense tracker | Easy | Forms, local storage, simple totals |
| 2. Web scraper + dashboard | Medium | Fetching data, displaying it, scheduling |
| 3. Automated report generator | Medium | Combining data sources into a document |
| 4. Website chatbot widget | Medium-Hard | Connecting a UI to an AI API |
| 5. Browser extension | Hard | Browser APIs, packaging, permissions |
1. Personal expense tracker
A page where you log expenses (amount, category, date) and see totals by category. Ask your AI agent to use plain HTML/JS with local browser storage so nothing needs a server.
2. Web scraper + dashboard
Pick a public, scrape-friendly data source (e.g., a public API for weather or prices) and build a small dashboard that displays it, refreshing on a schedule.
robots.txt before scraping — prefer official APIs when they exist, and never scrape data behind a login without permission.3. Automated report generator
Combine a few data points (e.g., your expense tracker’s totals + a date range) into a simple text or PDF report, generated on demand. This teaches you how AI agents can chain steps: gather data → format → output a file.
4. Website chatbot widget
Build a small chat widget that sends user messages to an AI API and displays responses. This is a great intro to working with API keys safely (never hardcode them in client-side code that gets published).
5. Browser extension
A simple extension that does one thing — e.g., highlights certain words on a page, or adds a button that summarizes the current page’s text via an AI API. Browser extensions teach permissions, manifests, and packaging — useful concepts beyond just this project.
Write a one-page specification before the agent writes code
Treat every project as a separate repository with a one-page README. State the learning goal, data source, permissions, and completion test before asking an agent to scaffold files.
A useful specification names the user, the single problem, inputs, outputs, storage, supported devices, and what is deliberately out of scope. Add three examples of expected behavior and three edge cases. This gives the coding assistant a target that can be tested instead of a mood that can be interpreted endlessly.
Goal: Finish one small project that teaches a reusable engineering pattern
Must have: README, error handling, sample data, focused tests, and a reproducible build
Out of scope: Production accounts, scraped private data, hidden API keys, and uncontrolled spending
Done when: Another person can install, run, test, and remove the project from the READMEUse a reviewable AI coding workflow
- Initialize version control and make a clean starting commit before asking for edits.
- Ask the assistant to inspect the project and propose a short plan. Correct the plan before code generation.
- Implement one vertical slice at a time: interface, behavior, validation, persistence, then polish.
- Review every diff and command. Do not approve deletion, credential access, package installation, or deployment without understanding it.
- Run formatting, type checks, tests, and a production build outside the assistant’s narrative.
Define acceptance tests a beginner can actually run
Each project needs a different acceptance test: totals remain correct after refresh, API failures show a useful state, reports match source data, chats reject oversized inputs, and extensions request only needed permissions.
| Test layer | Example check | Failure means |
|---|---|---|
| Happy path | A normal user completes the main task | The core feature is incomplete |
| Input validation | Empty, negative, long, or malformed values | The app trusts unsafe input |
| Persistence | Refresh or restart and verify saved data | Storage behavior is unclear |
| Responsive UI | Use phone and desktop widths | The interface is device-dependent |
| Production build | Build from a clean checkout | The result only works in the agent’s session |
Choose tools by workflow, not leaderboard position
Choose the project whose failure modes you want to learn. Storage, APIs, document generation, secure backends, and browser permissions are more valuable lessons than simply producing five demos.
Run the same bounded task in the free tier or trial of each candidate. Measure setup time, number of corrections, diff quality, test success, and how confidently you understood the result. Check current pricing, privacy, model availability, and usage policies directly from the provider before paying; those details can change after this article is published.
Keep the comparison reproducible. Save the starting commit, prompt, tool version, model selection, elapsed time, final diff, and test output. Repeat the exercise after a major release rather than assuming one result is permanent. Coding assistants evolve quickly, and a tool that wins on autocomplete may still lose on repository-wide planning, command safety, or explaining a failure to a beginner.
Official references and further reading
- GitHub Docs: GitHub Pages
- Chrome Developers: Extensions
- NIST: Artificial Intelligence Risk Management Framework
FAQ
Should I do these in order? Roughly yes — each one builds on concepts (storage, APIs, scheduling, packaging) from the previous ones, but feel free to skip to whatever interests you most.
What if I get stuck for hours on one bug? Ask your AI agent to add debug logging/print statements to see what’s actually happening at each step — most “stuck” moments are about not knowing where the problem is, not how to fix it.
Do I need to pay for APIs? Most have free tiers sufficient for personal projects — check current limits before building something that depends on heavy API usage.
Bottom line: small, varied projects with an AI agent teach you more than one big ambitious project you never finish. Pick #1, finish it this week, then move on.