Skip to content

Latest commit

Β 

History

History
43 lines (36 loc) Β· 1.51 KB

File metadata and controls

43 lines (36 loc) Β· 1.51 KB

πŸ›’ FinCart

A mini e-commerce web app built with React, Redux Toolkit, React Query, TailwindCSS, Vite, and TypeScript.
This project demonstrates clean and modular React code, modern state management, and attention to UI/UX.


πŸš€ Features

  • βœ… Product listing with search & category filter
  • βœ… Product card with background image style
  • βœ… Add to Cart with loading spinner simulation
  • βœ… Cart page with:
    • Increase / decrease quantity
    • Remove items
    • Sticky order summary card
  • βœ… Toast notifications when adding items to cart
  • βœ… Pagination with icons
  • βœ… Skeleton loader for images while loading
  • βœ… 404 Not Found page
  • βœ… Error Boundary for safe rendering
  • βœ… Responsive & modern TailwindCSS UI
  • βœ… Lucide icons integration

πŸ—οΈ Project Structure

β”œβ”€β”€ public/             # Public assets (favicon, index.html)
β”œβ”€β”€ src/
β”‚   β”œβ”€β”€ assets/         # Static images & icons
β”‚   β”œβ”€β”€ components/     # Reusable UI components
β”‚   β”œβ”€β”€ features/       # Redux slices (cart, etc.)
β”‚   β”œβ”€β”€ hooks/          # Custom hooks (categories, products, etc.)
β”‚   β”œβ”€β”€ pages/          # Pages (Home, CartPage, NotFound)
β”‚   β”œβ”€β”€ types/          # TypeScript types
β”‚   β”œβ”€β”€ App.tsx         # Main app with routes
β”‚   β”œβ”€β”€ main.tsx        # Entry point
β”‚   └── index.css       # TailwindCSS setup
β”œβ”€β”€ package.json
β”œβ”€β”€ vite.config.ts
└── README.md           # Project documentation