Live Demo → https://zrozik-cmd.github.io/Phone_Catalog/
Fully functional e-commerce Single Page Application built with React and TypeScript. The project simulates a real online store with product catalog, filtering, sorting, cart management, and favorites functionality.
The application focuses on clean architecture, reusable components, and scalable state management.
- Multi-page navigation with React Router
- Product categories (Phones, Tablets, Accessories)
- Sorting options (Newest, Alphabetically, Cheapest)
- Pagination with selectable items per page
- Product details page with color and capacity selection
- “You may also like” recommendations
- Add / remove products from Cart
- Cart quantity control
- Total price calculation
- Add / remove Favorites
- Persistent state using localStorage
- Loading & error state handling
- Fully responsive design (desktop + mobile)
- React
- TypeScript
- React Router
- SCSS (CSS Modules / BEM)
- Redux (state management)
- Fetch API / Axios
- LocalStorage API
- Modular component-based architecture
- Reusable UI components (ProductCard, Pagination, Loader, etc.)
- Centralized state management for Cart & Favorites
- Dynamic routing for product detail pages
- Query parameter synchronization (sorting, pagination)
- Data-driven rendering from JSON / API
- Optimized re-renders using memoization
- Clean separation of UI, business logic, and services
git clone cd react_phone-catalog npm install npm start
Open in browser: http://localhost:3000
- Tymofii Vasylenko
- GitHub: @Zrozik-cmd