A fully functional, responsive eβcommerce application built with Nuxt 3 and the FakeStore API, designed to simulate a real-world online shopping experience. This project highlights my skills in modern Vue development, composable architecture, and dynamic user interface design.
π Key Features
Product Catalog & Details
Fetches live product data from the FakeStore API and displays it in a structured, responsive grid. Each item links to a dedicated product page with full details, including image, description, and price.
Interactive Shopping Cart
Users can add and remove items from the cart. Cart state is persisted using Pinia + LocalStorage, ensuring session continuity across refreshes.
Responsive UI
Designed with custom CSS3, ensuring mobile-first responsiveness and usability across all screen sizes.
Routing & State Management
Implements Nuxt routing and Pinia store for seamless page transitions and centralized cart management.
Error Handling & Loading States
Includes conditional rendering for loading states and error feedback, providing a smoother user experience.
π οΈ Tech Stack
Vue 3 / Nuxt 3 β Framework and SPA architecture
Pinia β Lightweight state management
JavaScript (ES6+) β App logic and API integration
CSS3 β Custom responsive styling
HTML5 β Semantic structure
FakeStore API β Realistic dummy product data
LocalStorage β Persistent cart state between sessions
π§ What I Learned
Building full-featured apps using the Composition API in Nuxt 3
Managing state with Pinia and syncing it to the browser
Handling dynamic routing and async data loading in Nuxt
Designing clean UIs with pure CSS, without utility frameworks
Creating smooth UX with proper error handling and conditional rendering