A state of the art testing facility for mail-in automotive repairs

Three years of growth from day one

The ECU Pro is a headless eCommerce site, using Shopify as its backend. I built the frontend application primarily with Nextjs, FaunaDB, and Shopify's GraphQL APIs.

The client's eCommerce offering was initially developed and maintained by another service provider. Built with WooCommerce, it was painfully slow, hard to navigate, and error-prone. Since going live with my headless solution three years ago and with continuous feature updates and maintenance since, the site's monthly revenue has increased by 1093%.

Vehicle data mapping and content inheritance

I built a standalone vehicle importer to populate thousands of vehicles and their related services using the client's preferred offline data management. Initially, I used FaunaDB to manage normalised indexes and product mappings, but later migrated to Shopify Metaobjects; eliminating a third-party dependency and reducing hosting costs.

The system supports many-to-many vehicle-service mappings with cascading content inheritance. Collections define shared content, which products and then variants inherit and customise respectively. Vehicle mappings further tailor content on the frontend application, enabling scalable, unique updates across thousands of entries.

Additionally, proxy products inherit and pass on data from common products, allowing efficient creation of part-specific services without duplicating backend entries.

Realtime order support and operational guidance

The frontend includes a secure customer account section focused on guiding users through the post-order process.

The initial purchase flow is minimal and streamlined by not including information and requirements superfluous to the sale conversion. The account section then collects additional work order details and provides service-specific instructions for removing and sending in parts.

Custom Shopify order attributes, statuses, and Zoho Desk tickets create order views, with clear statuses and prompts. A real-time messaging interface syncs with ticket threads and email correspondence, keeping customers informed and assured throughout the process.

Get the traffic and convert quickly

Many incoming searches lack the specificity needed for accurate sales. To address this, catch-all landing pages confirm service availability and prompt users to select their vehicle. The vehicle selector adapts to user intent, taking them directly to the correct service type of many with the necessary vehicle-specific details.

Lightening fast edge network deployments with custom telemetry

The frontend uses Incremental Static Regeneration, a preloading router, and edge deployment for near-instant page transitions. Due to the limited server-side logging and debuging abilities within the serverless deployment setup, I have implemented telemetry where needed to diagnose and resolve issues.