ConnectPro: an e-commerce platform for automotive connectors

Finding the right automotive connector is hard. Part numbers are cryptic, series look alike (Deutsch DT, AMP Superseal, Molex MX150), and workshops often have only a broken plug in their hand. General marketplaces don't show the technical data a technician needs, and wholesale buyers have no easy way to ask for volume pricing.

We built ConnectPro, a fast, Serbian-language storefront designed around how technicians actually search: by vehicle, by OEM number, or by photo. Every product shows full engineering specs, and wholesale customers get their own quote and account flows.

1. Vehicle finder: pick year, make, model and version to narrow the catalog. 2. OEM search: enter a manufacturer part number and go straight to the matching part. 3. AI connector identification: upload photos of an unknown connector and get back series, pin count and SKU. The flow is built to work with Google Gemini. 4. Product pages with detailed specs (pins, gender, amperage, voltage, seal material, IP67/IP69K), live stock and discount pricing. 5. Cart and order summary handled globally through React Context. 6. Wholesale quote builder and a customer portal with order history for B2B clients.

- React 19 - TypeScript - Vite 6 - Tailwind CSS 4 - React Router 7 - Motion - Lucide icons - Google Gemini SDK (@google/genai)

1. 7 customer journeys shipped in a single, lightweight SPA: home, shop, product, identify, cart, bulk quotes, account. 2. A typed product model (SKU, series, brand, specs, stock) that is ready for a real catalog or ERP feed. 3. An AI-ready identification flow that cuts down "which connector is this?" support calls. 4. A B2B quote path alongside retail checkout, on one platform.

Connect the catalog to live inventory, switch the identification step from simulated to real Gemini vision calls, and add payment and shipping integrations.