Repository navigation
Project Overview
WriteOff is a fictional online stationery store designed to sell products such as pens, pencils, notebooks, paper, markers, and other writing supplies.
The project was developed as a React single-page application. Instead of loading separate HTML pages, React conditionally renders the appropriate view based on the user's navigation.
The application contains the following primary views:
- Home
- Shop
- Product Detail
- Cart
- Account
- Create Account
Reusable React components include:
- Navbar
- ProductList
- ProductCard
- CartItem
Product information is stored in JSON and rendered dynamically using React.
The shopping cart uses React state to store selected products. Users can:
- Add products to the cart
- Select product options
- Select quantities
- Increase or decrease quantities
- Remove products
- View the subtotal
- View the current cart quantity in the navigation bar
Product quantities are prevented from exceeding the available stock.
WriteOff contains 25 stationery products. Products contain information including:
- Name
- Description
- Category
- Price
- Rating
- Quantity in stock
- Available colors
- Product options
- Product image
- Featured product status
- New arrival status
The Shop view uses pagination so that products are divided across multiple pages.