Knock Off Fashion is a Laravel-based admin interface for managing products in a fictional fashion web shop.
Why buy Gucci when you can buy Guggi?
The application simulates a simple administration system where a user can manage products in a clothing store database.
This project was created as part of a course assignment to demonstrate understanding of Laravel development, MVC architecture, CRUD operations, filtering, pagination, and accessibility (WCAG).
The administrator can:
-
Create products
-
View all products
-
Update product information
-
Delete products
Products contain information such as:
-
Brand name
-
Product name
-
Description
-
Price
-
Category
-
Color
-
Stock quantity
Products can be filtered by:
-
Brand name
-
Product name
-
Category
-
Price range
Filtering is handled through query parameters and controller logic.
Product listings use Laravel pagination to limit the number of products shown per page and improve usability.
The project includes:
-
A Product Factory
-
A Database Seeder
This ensures the database can be populated with realistic mock fashion products, making the application look the same on different machines.
Example data includes clothing brands, colors, categories, and price ranges.
Database Structure
Products include both a brand name and a product name. This makes the catalog more realistic and allows administrators to distinguish between different items from the same brand.
Several accessibility practices have been implemented:
Semantic HTML
The interface uses semantic elements such as:
-
nav
-
main
-
section
-
table
-
form
This improves navigation for assistive technologies.
Forms include:
-
Proper associations
-
Accessible error messages
-
Clear input instructions
-
Error Handling
Validation errors display text explanations, not just visual indicators such as color.
"The price field must be a number."
Color is not used as the only indicator for errors or status messages.
The layout has been tested with browser zoom to ensure content remains readable and usable. Horizontal scrolling is allowed for large tables as long as content remains accessible.
-
Laravel 12
-
PHP
-
SQLite
-
Blade templating engine
-
Tailwind CSS
-
DaisyUI
- Laravel Breeze
-
Composer
-
Node.js
-
Vite
-
GitHub
Authentication is implemented using Laravel Breeze.
For this project, registration is not used. A predefined admin account is used instead.
Email: admin@test.com
Password: password
Follow these steps to run the project locally.
https://github.com/EmmaRask/Knock-Off-Fashion-.git
Navigate into the project folder:
cd Knock-Off-Fashion-/knockofffashion/
composer install
npm install
npm run build
cp .env.example .env
php artisan key:generate
php artisan migrate
- If prompted with the option to create a database, select "Yes"
php artisan db:seed
- This will generate sample product data.
- Run Laravel:
php artisan serve
Visit:
The application follows Laravel's MVC architecture.
app/
├── Http/
│ ├── Controllers
│ │ ├── ProductController.php
│ │ └── ProfileController.php
│ └── Requests
│
├── Models
│ └── Product.php
│
resources/
├── views/
│ ├── layouts
│ ├── products
│ ├── profile
│ └── dashboard.blade.php
│
database/
├── factories
└── seeders
Handle database interaction and business logic.
Handle incoming requests and application logic.
Blade templates responsible for the user interface.
Emma Backman
Olof Björn
This project was created for educational purposes.
All brand references (such as Guggi) are fictional.