Loading news...

Advanced Higher Computing

Physical Media Inventory Manager - Vinyl Collection Page with Filters

For my Advanced Higher Computing project I built a Physical Media Inventory Manager which was a web app for tracking collections of vinyl records, cassettes and CDs. The project covers both web design and integration with a relational database, all running through a local XAMPP server that I tunnelled to a live domain using Cloudflare so others could actually use it.

I had to analyse the problem, design a full solution. Showing the process across analysis, design, implementation, testing and evaluation stages. The site is a multi page PHP website where users can create an account, log in, add physical media to their personal collection using a form, and then search, filter and sort everything they own. On top of the required features I also added a public user leaderboard and a collection stats page.

The database side was where I felt most out of my depth at first as I've never created and accessed a database before. Getting the dynamic search filters and server side validation all chaining together properly was very cool. I'm very pleased with the overall UI/style of the site.

HTML & CSS PHP MySQL VS Code XAMPP Cloudflare
Web Development

I built a multi page PHP website with HTML forms for adding, editing and deleting media items. CSS media queries for the responsive layout for smaller screens. PHP session variables keep users signed in across all pages storing their userID, username and login time. Server side validation makes sure fields only accept correct inputs, enforced in PHP rather than relying on the HTML alone.

Database Integration

I designed two MySQL tables. One for user login details and one for the media collection, linked via a foreign key on userID. PHP PDO handles all the queries covering: INSERT, SELECT, UPDATE and DELETE. The collection view builds a dynamic SQL query that chains WHERE conditions based on whichever filters and search terms the user has active at the time, including title, artist, location, media type and a year range. I also wrote more complex JOIN queries to power the user leaderboards ranking users by collection size, average release year and most collected artist.

Project Folio

This browser does not support embedded PDFs. Download the PDF .

Screenshots
Physical Media Inventory Manager - Collection Page with Search and Filters

Media Collection Page

Physical Media Inventory Manager - User Leaderboard Page

Collection Leaderboard Page

Physical Media Inventory Manager - Responsive Navbar Animation

Navbar Showcase

Physical Media Inventory Manager - Add Media Form with PHP Validation

Add Media Page

Physical Media Inventory Manager - User Profile Page

User Profile Page

Physical Media Inventory Manager - Collection Stats Page

User Stats Page

Licences & Credits