π¨βπΌ Welcome to the Inventory Manager! This is a practical React app that uses
TypeScript classes for the core business logic. You'll implement the classes
in a utilities module to power the UI.
Getting Started
π¨ Open
and implement the classes,
interfaces, and methods. Every π¨ comment is something for you to fill in.
π¨ Open
and look for TODO callouts in the UI.
As you implement the class logic, those TODOs will turn into real data.
Running the App
npm run dev
What to Implement
In src/classes.ts
- Inventory base class with private fields
- Interfaces for Sellable and Trackable behaviors
- Inheritance for Electronics, Clothing, and Perishable items
- Method overriding for descriptions and pricing
- Composition with logger implementations and InventoryManager
In src/app.tsx
- Verify the UI updates once class methods are implemented
- Check the TODO callouts to confirm you've completed each piece
Tips
π° Start with the base
InventoryItem class. Many other classes depend on it.π° When you implement pricing, be consistent about using
basePrice,
quantity, and discountPercent.π° Use the logger classes to see the effects of dependency injection.
No Tests, No Solutions
π This is practice time! There are no tests or solutions. Experiment, make
mistakes, and build confidence by applying what you've learned.
