MyShop - JavaScript Frameworks Project

Overview

MyShop is a responsive eCommerce web application built with React. The project focuses on applying React fundamentals — including component-based structure, routing, state management, and form validation — to create a fully functional online store. The app integrates with the Noroff API to dynamically fetch and display product data.

Key Features

Built with React using functional components and state management
Dynamic API integration for products via the Noroff Online Shop API
Reusable <Layout> component for consistent header and footer
Fully responsive design built with CSS Modules
Interactive search bar with real-time product filtering
Product page with interactive Add to Cart option
Shopping cart with item tracking and total calculation
Checkout success page that clears cart and confirms order
Validated contact form with required fields and error handling

UI Showcase

MyShop homepage screenshot — Homepage - displays all products with a real-time search bar for filtering results.

MyShop product detail page screenshot — Product Page - detailed view with product image, description, discount logic, and Add to Cart feature.

MyShop shopping cart screenshot — Cart Page - lists all items in the cart, shows the total, and includes a checkout button for convenience.