Phone Catalogue Discover your perfect Apple device – Explore a wide selection of iPhones, iPads, and Apple Watches. Easily compare models, add products to your cart, or save your favorites. Enjoy a seamless shopping experience with intuitive navigation and real-time updates.
Experience the live website https://pasha1932.github.io/iphone-catalog/
https://www.figma.com/file/T5ttF21UnT6RRmCQQaZc6L/Phone-catalog-(V2)-Original - Design of the site
-
Core React — User Interface Framework TypeScript — Code Type Safety SCSS — Styling
-
State Management Redux Toolkit — Application State Management
-
User Interface and User Experience (UI/UX) React Router — Navigation React-slick — Image Galleries React-carousel — Image Slider React Loading Skeleton (v3.3.1) — Loading Status Visualization i18n — Multi-Language
-
Development & Deployment Vite — Build Tool ESLint — Code Quality Control Prettier — Code Appearance
Clone the repository: git clone https://github.com/your-username/project-name.git cd project-name
Install dependencies: npm install or yarn install
Run the project locally: npm start or yarn start
- Responsive Design : Optimized for different screen sizes and devices, responses on width 320px, 640px, 1200px, 1440px.
- Navigation : react-router-dom library is used in the application to enable navigation between multiple pages, and URL-based search parameters saved when navigating.
- Favorites & Cart : Adding products to favorites or shopping cart, with total price calculation.
- Product Filtering : Filter products by capacity and color inside product card.
- Sorting : Sort products based on criteria: year, price, alphabetically.
- Pagination : Navigate through large lists of products, opportunity to choose number of items per page, and number of pages depends on this.
- Scroll to Top Button : Easily return to the top of the page.
- Loader : Indicates loading status for a better user experience.
- Switching Theme: You can switch a theme: white or dark.
- Switching Language: You can switch a theme: Ukraininan or English.
- Breabcrumbs: Navigation back