Why Did I Build This?
"Mainstream e-commerce architectures (e.g., WooCommerce) enforce bloated DOM structures and inflexible database schemas. I engineered MangaSokağı from scratch to establish a decoupled architecture that enforces data integrity natively at the database level while delivering a fully customized, type-safe shopping experience on the frontend."
Architecture & Decisions
The persistence layer runs on PostgreSQL. Data integrity is enforced natively via explicit `CHECK` constraints (bypassing the lack of synthetic `UNSIGNED` types), custom `ENUM` types (`manga_badge`), and `TRIGGER` functions automating `updated_at` lifecycles. The frontend is built on the Next.js App Router, leveraging Zustand for decoupled client-side state management. The network boundary strictly implements the Adapter pattern (`mapVolumeToManga`, `mapSeriesToMangaDetail`) to translate raw backend DTOs into sanitized UI interfaces.
Key Features
- 01.Strict Adapter pattern integration to isolate the frontend from backend API contract mutations
- 02.Hardware-accelerated, hotkey-driven (⌘K), and debounced asynchronous search engine (SearchModal)
- 03.Conditional PostgreSQL indexing (Partial Indexing) on `is_new_arrival` and `is_best_seller` flags to heavily optimize queries for specific catalogs
- 04.Active mitigation of React Hydration mismatches via a `requestAnimationFrame`-based render deferral algorithm
- 05.Accessible (a11y), DOM-portal-based asynchronous cart module (CartSlideOver) utilizing Headless UI
This project demonstrates how strict data consistency should be enforced at the database engine level (PostgreSQL) rather than relying on application-layer logic. On the frontend, connections between state (Zustand) and UI components execute with high performance. The implemented Adapter pattern acts as a critical isolation layer, ensuring that schema changes in the backend do not fracture the React component tree.