Codelab: A Shopping-Cart Module

Build a real shopping-cart data layer in a plain HTML file — immutable add/remove with spread and filter, totals with reduce — and run it in your browser.

Step 1 of 4

Step 1 — set up the project

Let's build a working cart you can open in a browser — no build tools, just one HTML file. Open a terminal (on Linux, Ctrl + Alt + T) and run the commands below to make a folder and an empty file, then open the folder in your editor.

The commands: mkdir makes a directory, cd moves into it, touch creates an empty file, and code . opens the current folder in VS Code (use your editor of choice if different).

Tip

If code . doesn't work, just open the cart folder from your editor's File → Open Folder menu instead. The terminal commands only create the folder and file.

TYPESCRIPTREAD ONLY