Project · Frontend Web Development
Project: a typed shopping cart in TypeScript
The brief
Write the cart logic of BazaarKart, an online store, in TypeScript: totals in paise, GST by category with Record, discounts as a discriminated union, a generic groupBy, a React-style reducer that never mutates state, and Indian currency formatting for the invoice.
Why it matters
In a real React or Next.js app, the screens are thin and this kind of typed logic is the heart of the product. Companies hiring for TypeScript roles test exactly these skills: union types with narrowing, generics, immutable updates and reducers like the ones useReducer and Redux use.
Skills you practise
- interfaces and typed functions
- Record and union types
- discriminated unions and never
- generics with constraints
- immutable updates and reducers
- Intl.NumberFormat for ₹
What you will have at the end
cart.ts: a typed, tested cart module (totals, GST, discounts, reducer, invoice) that could drop into a React app.
How it is marked (rubric, 100 points)
| Correct behaviourEvery check passes, including caps, minimum orders and empty carts. | 40 |
|---|---|
| Strong typesNo any; unions, Record and generics describe the data exactly; the never check is in place. | 30 |
| Immutable and pureNo function changes its inputs; the reducer returns new arrays and objects. | 20 |
| ReadableClear names, money in paise until the moment it is shown. | 10 |
0/6 steps done
Step 1 of 6
Totals in paise
lineTotal(item) returns price × quantity in paise, and subtotal(items) adds up the lines (0 for an empty cart).
Money as decimals goes wrong: 0.1 + 0.2 is not 0.3 in JavaScript. Shops and payment gateways (Razorpay and UPI APIs included) store money as whole paise instead. The types say exactly what goes in and comes out, so the editor warns you if you pass a Product where a CartItem is needed.
The checks run your code; the TypeScript types are checked by your editor, so keep them accurate.
Run shows what your code prints. Check runs the step's tests. Ctrl+Enter checks too.