Case study / Precision machining and gearbox repair / Saint-Hubert, QC / 2026
St-Hubert Machine Shop
St-Hubert Machine Shop has been machining gears and rebuilding gearboxes since 1979, but its website did not reflect that experience. We migrated and redesigned the whole site as a fast, fully bilingual Next.js build with a quote form that engineers can actually use.
Visit the live site ↗96/100
Mobile PageSpeed score (up from 52)
+38%
Online quote requests in the first 3 months
#1
Position on Google for their main searches after the redesign
The challenge
The shop serves heavy industry across Quebec and Ontario: high-precision machining, gear hobbing, gearbox overhauls, a 24/7 mobile machine shop, and authorized Radicon repairs. The old website had grown over the years and was slow on phones, hard to update, and the French and English versions no longer matched page for page.
Most visitors are maintenance managers and buyers looking for one thing: can this shop fix my part, and how fast. They often check from the plant floor on a phone. Quote requests mostly arrived by phone or plain email without drawings, which meant a lot of back-and-forth before the engineering team could even price a job.
What we built
We rebuilt all 35 pages in Next.js with static generation, so every page is pre-rendered and served from the edge. English and French live under /en and /fr with a strict one-to-one mapping, so switching language always lands on the same page. We wrote the design system in plain CSS modules, without a UI framework, which kept the pages light and let us match the shop's industrial look.
The core of the project is the quote form. Visitors pick a service type, describe the job and attach a drawing or photo; the request is emailed straight to the shop with the file attached. We also organized the services into clear pages (machining, mobile onsite work, gearbox and gear repairs, industries served) and added galleries for machining, gears, fabrication and video, so buyers can see the equipment before they call.
On the SEO side, each page has its own title, description and hreflang tags in both languages, and the structure follows how people search: gearbox repair Montreal, gear manufacturing, mobile machining. We still handle updates like job postings and news for the shop.
Highlights
- 35 pages in English and French with matching URLs
- Quote form with file upload for drawings and photos
- Machining, gear, fabrication and video galleries with a lightbox
- Dedicated pages for services, industries, products and the Radicon repair center
- Careers and news sections the shop can keep current
- Bilingual help widget that guides visitors to the right page
- Per-page SEO metadata, hreflang and sitemap
Built with
Next.js · React · TypeScript · next-intl · CSS Modules · Resend · Vercel · Vercel Analytics
Let's talk about your project
Tell us about your business. We'll reply with a clear plan and a working demo early in the project.