WayzFinder & FadFit | Web Project Case Studies by Sijo Jose

Latest Web Project · Current Role

WayzFinder Mortgage Broker Website

Production mortgage-brokerage platform for the UAE market. Visit Website

Executive Summary

WayzFinder is an independent mortgage brokerage's complete digital presence, a 17-page marketing and lead-generation site, a self-service mortgage calculator driven by live interbank rate data, a bilingual AI chat assistant, and the backend systems that turn visitor interest into a managed pipeline of sales leads. Built as a hand-authored, framework-free HTML/CSS/JS frontend on a thin PHP/MySQL API layer, backed by a genuinely production-grade operations layer: two independent GitHub Actions pipelines keep interbank rate data current every business day and deploy every commit to the live server automatically, with redundancy engineered into every step.

Also Managing WayzFinder's Instagram

Beyond building the website, I run WayzFinder's Instagram presence end-to-end, content planning, posting, and audience engagement for the brand.

@wayzfinder

HTML Pages

PHP Files

~26.5K

Lines of Code

Lead Sources Unified

CI/CD Pipelines

Frontend Architecture

Core: Hand-authored HTML5, CSS3, vanilla JavaScript, no framework, no bundler, no build step.
Design system: Custom emerald/gold palette with a "liquid glass" glassmorphism token set; fluid typography via CSS clamp().
Live data: Sticky auto-scrolling EIBOR interbank rate ticker, refreshed daily by CI with static fallback values baked in.
Accessibility: Semantic HTML, full ARIA labelling, and site-wide prefers-reduced-motion support.

Backend Architecture

Server: Hostinger, PHP (PDO) + MySQL, 16 single-purpose endpoint/library files.
Lead pipeline: One unified leads table merging 6 intake sources into a single admin dashboard.
Notifications: Every new lead triggers an authenticated SMTP email and a WhatsApp Business API alert.
Documents: Branded amortization-schedule PDFs generated and emailed on demand.

Bilingual AI Chatbot

Claude-powered assistant, English/Arabic aware with automatic RTL rendering.
Grounded in live rate data and curated FAQ content, never a hallucinated number.
Tool-based lead capture that writes straight into the CRM.
Per-IP and site-wide daily message caps to keep API cost bounded.

Automated CI/CD

Two independent GitHub Actions pipelines: rate refresh and deployment.
Rate scraper drives a real headless browser past a government WAF, 6×/day with an external cron backup.
Deploys via rsync over SSH within ~2 minutes of every commit, with a 30-minute safety-net re-run.

Engineering Challenges Solved

FTP deploys reporting success while silently failing, switched to rsync over SSH, which diffs directly against the real remote filesystem instead of trusting a cached transfer state.
A scheduled bot's own commits never triggering deployment, GitHub's anti-recursion protection was silently blocking it; fixed by explicitly re-dispatching the deploy workflow via the API.
A government rate page blocking every scripted request, drove an actual headless browser (Playwright) so the fetch is indistinguishable from a real visitor's.
The host's image optimizer silently corrupting an animated PNG, served it under a .apng extension so the optimizer no longer touches it.

Featured Project

FadFit E-Commerce Platform

Custom-built Gen-Z streetwear platform with seamless SPA routing. Visit Website

Executive Summary

FadFit is a custom-built, high-performance e-commerce web application designed specifically for the Gen-Z streetwear market in India. The platform has been engineered to deliver a seamless, "app-like" user experience without the need for page reloads. It features a sleek "dark mode" aesthetic, complete with dynamic product loading, secure user authentication, interactive profile management, and an integrated PayPal checkout system.

Frontend Architecture

Core: HTML5, Vanilla JavaScript (ES6), CSS3.
Styling: Tailwind CSS (Dark palette #121212 with Electric Green & Cyber Purple accents).
Routing: Custom SPA hash-routing for instant, zero-reload navigation.
UI/UX: Google Fonts (Space Grotesk, Inter), Phosphor Icons, and Real-time "type-ahead" search.

Backend Architecture

Server: Hostinger, PHP 8+ with custom JSON API endpoints.
Database: MySQL with PDO Prepared Statements to prevent SQL injection.
Security: Secure password hashing and local storage session caching.
Dynamic UI: Categories and IG Feed grids fetched directly from the DB.

Authentication System

Email & Password with functioning secure reset links.
Firebase Mobile Number OTP (Supports IN, UAE, US).
Google OAuth One-Click login.

E-Commerce Features

Dynamic Product Catalog & Interactive PDP.
Customer 5-star Review Engine.
Sliding "Mini Cart" & Full Cart with persistent caching.
Integrated PayPal Smart Buttons (INR to USD conversion).

Profile Management & Scalability

User Profile: Dedicated sliding panel for updating delivery info, custom Base64 profile picture uploads, and an API-driven Gen-Z stock avatar gallery.

Scalability: The vanilla JS and custom API architecture ensures maximum scalability, allowing easy future integration of Admin Dashboards, inventory tracking, and regional payment gateways like Razorpay with minimal friction.