TilBeauty
Single Vendor E-Commerce

TilBeauty

Full-stack cosmetics & skincare e-commerce platform featuring dynamic product variations, session cart workflows, and automated invoice generation.

Role: Lead Developer
Year: 2024

Project Overview

TilBeauty is an end-to-end e-commerce platform tailored for cosmetics, skincare, and personal care retail. Designed to deliver an intuitive and polished shopping experience, the platform enables customers to discover beauty products, customize product variations (shades, formulas, sizes), apply coupon discounts, select regional delivery zones, and place orders smoothly.

Core Architecture & Technical Highlights

Built on Laravel 10, PHP 8.1+, MySQL, Tailwind CSS, and Alpine.js, the application provides high reliability, responsive user interactions, and robust administrative control:

  • Dynamic Product Variation Engine: Beauty products often require complex attributes (e.g., shades, container sizes, scent profiles) with individualized pricing and inventory counts. The platform implements a JSON-backed variation schema paired with frontend AJAX price listeners to deliver seamless variant switches without page reloads.
  • Session-Based Cart & Multi-Discount Checkout: Handles real-time cart state management, instantaneous quantity updates, dynamic regional shipping fees, and coupon calculations (flat amounts vs. percentage-based discounts) with automated cart-level revalidation.
  • Administrative Order & Inventory Control: Provides full lifecycle order tracking (Pending, Processing, Completed, Cancelled), customer invoice rendering with obfuscated prefix-based UUID lookup tokens, stock depletion alerts, and sales performance analytics.
  • Role-Based Access & Content Management: Enforces distinct access tiers for administrators, staff employees, and store customers. Includes full control over hero sliders, promotional banners, product reviews moderation, customer contact inquiries, and a beauty blog.

Tech Stack

LaravelPHPMySQLTailwind CSSAlpine.jsBladeViteJavaScriptHTML5CSS3Axios