Understand what the agent built
You do not need to know how to code to understand what the agent has built. This lesson takes you on a tour of a React and Vite project so you know what each important file is for and where the data is stored. You can then tell what your app can do without a server, and what it cannot.
Lesson objective
By the end of this lesson, you will be able to explain what the main files of a React and Vite project are for, say where your app's data lives, and deduce what it can and cannot do without a back end.
Topics covered
- React
- Vite
- project structure
- data storage
- back end
Where it fits
Set up your machine and generate the first version
How do I get a first version running on my machine, and understand what was created?
Lessons in this module
- Set up your workstation
- From framing to plan, then to code
- Understand what the agent built (this lesson)
What you will learn in the course
This lesson is part of the course Build and ship a web app with an AI coding agent
- Frame a tool (problem, user, inputs, expected result) and write its acceptance criteria before generating a single line of code.
- Choose between a chat with artifacts, an app builder and a coding agent based on the need, the level of control required and the risk.
- Write a build request for a coding agent (context, scope, constraints, verification) and get a plan approved before any code is written.
- Set up the environment (terminal, Node.js, Git, Claude Code), run the application locally and explain what the main files of the generated project are for.
- Evolve and debug the application in small, checked, committed iterations, giving the agent the right context (symptom, steps, error message).
- Review the generated app before sharing it (behavior, edge cases, secrets, personal data, experience) and decide whether to ship, fix or stop.
- Publish the app from GitHub to a host with continuous deployment, get a public URL and evolve the live version without breaking it.
Related courses
- Add a database, authentication and payments to your appAdvanced · ~4 hr
- Work with Claude Code on a real project: context, planning, reviewAdvanced · ~3 hr
- Git for PMs: ship as a team without putting production at riskAdvanced · ~3 hr 30 min