Portfolio

Overview:

This simple Price Calculator app allows users to add multiple items with defined prices and quantities and instantly calculates the total cost. By leveraging TypeScript for type-checking and React for dynamic UI, this application offers reliable and interactive features.

Key Features:

1. Type Safety with TypeScript:
   • The Item interface enforces that each item has a price and quantity as numbers, ensuring data consistency and preventing runtime errors.
2. Real-Time Calculation:
   • The app recalculates the total price as soon as the user enters or changes values, providing immediate feedback.
3. Dynamic Input Fields:
   • Users can add multiple items, each with its own price and quantity inputs, making the app flexible for different scenarios.
4. Clean and Organized Layout:
   • A grid-based layout using Flexbox aligns inputs and labels neatly, enhancing readability and user experience.
5. Modular Component Structure:
   • The app is broken down into reusable React components, allowing for better scalability and ease of maintenance.

Tech Stack:

1. React:
   • Provides a component-based approach for building dynamic and responsive UIs.
2. TypeScript:
   • Adds static typing, making the code robust and less error-prone.
3. CSS Flexbox:
   • Used for layout organization, enabling a grid structure for inputs and labels.

Category:

Tags:

Links:

• GitHub