WEB-01 Live
Miramar — bilingual business website
A live English/Turkish site for an Istanbul construction-materials supplier: static-first Next.js, a selective 3D scene with a static fallback, and a Playwright smoke suite.
Recruiter summary
- Problem
- An Istanbul construction-materials supplier needed a credible bilingual web presence: a real equipment catalog, an RFQ-style contact flow, and English/Turkish parity.
- Contribution
- Designed, built, and deployed the whole site solo — a typed content layer, documented server/client boundaries, and one deliberate 3D scene with a static fallback.
- Result
- Live at tr-miramar.com with a Playwright smoke suite green in CI and documented architecture, SEO, accessibility, and content-restraint rules.
What it is
The public site for Miramar, an Istanbul-based supplier for construction and site development — materials, MEP, pumps, site prep — with an English/Turkish language switch, an equipment catalog with filters, and an RFQ-style contact flow validated with react-hook-form and Zod.
Engineering choices
Static-first App Router with documented server/client boundaries; a typed
content layer (content/site.ts) instead of hardcoded copy; one deliberate
React Three Fiber scene on the home page with a documented static fallback
rather than 3D everywhere. The docs set covers architecture, design system,
components, deployment, and SEO/accessibility — including an explicit
restraint rule: no invented clients, certifications, or performance claims.
Quality
A Playwright smoke suite renders all six routes, exercises the mobile menu,
the EN↔TR switch, the equipment filter, and contact validation. Semantic
landmarks, labeled fields, prefers-reduced-motion support, focus rings,
generated sitemap/robots, Open Graph metadata, and a custom 404 are in
place. The suite runs in GitHub Actions on every push (green as of July
2026), and the code is MIT-licensed.
