“FISH” is a fully functional, custom-built blog platform dedicated to marine creatures. Designed entirely from scratch without relying on pre-built Content Management Systems (like WordPress), this project serves as a comprehensive demonstration of web application architecture, encompassing frontend design, server-side processing, and relational database management.
The goal was to create a visually engaging, secure, and easily manageable platform that handles everything from user authentication to complex media storage.
| Authors | Jedrzej Golaszewski |
|---|---|
| Title | Fish |
| Status | Completed |
| Date | Jan 12, 2026 |
| Tech stack | HTML5, CSS3, Bootstrap, PHP, MySQL, Docker |
| Links |
Technology Stack
The application is built on a containerized LAMP-style architecture, ensuring a consistent and isolated development environment.
- Frontend: HTML5, CSS3 (Custom Glassmorphism styling), Bootstrap (Carousels & Navigation), JavaScript (Client-side validation & dynamic fetching)
- Backend: PHP 8.2 (Session management, CRUD operations, routing)
- Database: MySQL 8.0 (Relational data structuring,
LONGBLOBmedia storage) - DevOps & Infrastructure: Docker & Docker Compose
Key Features
Secure Authentication: Custom Login and Registration system with distinct access levels (Admin vs. Standard User).
Dynamic UI/UX: Features a sleek “glassmorphism” aesthetic, accompanied by a dynamic JavaScript-powered homepage carousel and a responsive blog post feed.
Admin Content Management: * Rich post creation including titles, descriptions, and dynamic paragraph sections.
Custom image handling for Banners (16:9) and Thumbnails (4:3).
Soft-delete functionality for easy post management directly from the feed.
Self-Contained Storage: Images are encoded and stored directly within the MySQL database as
LONGBLOBs, keeping post data portable and self-contained.
Architecture & System Design
The application operates on a robust three-tier architecture that clearly separates the User Interface from the Backend Logic.
Application Architecture Diagram
Users interact with visual frontend pages (like the home feed), which trigger hidden server-side handlers to execute core tasks. All backend scripts route their data operations through a centralized db.php utility, acting as a single, secure gateway to the MySQL database.
Entity-Relationship Database Diagram
Project Gallery
The Home Feed
A clean, responsive feed displaying the latest articles with custom thumbnails.
Article Layout
Engaging post layouts featuring 16:9 banner images and dynamic text sections.
Glassmorphism Login
Secure user authentication interface featuring custom, modern CSS styling.