Why Kits Exist
You could build a website by writing every HTML, CSS and JavaScript file by hand. For a tiny site, that’s fine.
But for anything bigger, it gets repetitive fast. The same menu on every page. The same footer. The same photo layout, copied over and over.
So people made frameworks (kits of ready-made parts and rules that make building faster). You’ll hear names like Next.js, SvelteKit, Astro, and Nuxt.
They All End Up in the Same Place
Here’s the thing to remember: browsers only understand HTML, CSS and JavaScript. They’ve never heard of any framework.
So every framework has a build step (a process that converts your project into plain files). You write handy pieces, and the build turns them into the files browsers read.
Different kits, same kind of files at the end. That’s why picking a framework matters much less than people think.
So How Do They Differ?
In smaller ways than their fans would have you believe:
| Kit | Known for |
|---|---|
| Next.js | The most popular. Huge community, lots of examples |
| SvelteKit | Light and fast, with simple code |
| Astro | Made for content-heavy sites like blogs and portfolios |
| Plain HTML | No kit at all. Perfect for tiny, one-page sites |
Fun fact: the website you’re reading right now is built with SvelteKit.
Remember the lesson from the very first note: you don’t pick a kit by learning them all. You tell Claude what you’re building and ask which one fits.
I want a personal website with a few pages and a photo gallery. Which framework would you use, and why? Keep it simple.Borrowed Building Blocks: Packages
Nobody builds everything from scratch. Frameworks are made of packages (pieces of code other people wrote and shared for free), and your project borrows them.
Three names you’ll see Claude use:
package.json: your project’s shopping list. It names the packages your project needs.npm: the shop. It fetches the packages on the list. (It came with Node.js.)node_modules: the pile of borrowed packages, sitting in a folder inside your project.
That last one surprises everyone. Your shopping list names a handful of packages, but each of those borrows others, which borrow others… and node_modules ends up with hundreds of them.
Never edit
node_modules, and never upload it. It can always be rebuilt from the shopping list with one command.
Claude already knows this. It keeps node_modules off GitHub automatically, using a file called .gitignore (a list of things Git should ignore).
The Commands You’ll See
You won’t type these, but you’ll see Claude run them:
| Command | In plain words |
|---|---|
npm install | “Fetch everything on the shopping list.” |
npm run dev | “Start the private preview of the site.” (Next note!) |
npm run build | “Run the build step and make the final plain files.” |
That’s all there is to it. A framework is a kit, packages are borrowed parts, and the build turns it all into plain files.