Case study / Trades business website
Golden Electrical Contracting
A full redesign for a licensed electrical contractor in Golden, British Columbia, rebuilt as a static site on GitHub Pages with a serverless contact mailer, so the company keeps a modern website and a working enquiry form with no monthly hosting bill.
The challenge
Keep the website modern without keeping a hosting bill.
Golden Electrical Contracting is a small, busy electrical contractor serving Golden and the Columbia Valley. Its public website ran on WordPress with paid shared hosting, and an earlier Next.js version leaned on a hosted content management system and a separately hosted mail function tied to a Gmail password. Each piece added a recurring cost or another account to keep alive, for a site whose content changes a few times a year.
The brief was straightforward: a cleaner, faster site that reflects the crew and the work, that costs nothing to keep online, and that still delivers enquiries to the company inbox reliably. That last point could not be a compromise. For a trades business, the contact form is the website.
The design
A confident, work-first identity for the trade.
The visual direction starts with the company's own colours and crew. A warm off-white base, a slate-blue accent, and Barlow Condensed typography give the site a sturdy, workwear feel, and every page opens with full-bleed photography or video of the team, their trucks, and their job sites around Golden.
Sections meet at slanted dividers that carry the eye down the page, and headings are underlined by a small animated detail: two lines extend from the edges and meet in the middle like a plug connecting. Content is organised into clear bands, with welcome copy, photo panels for Services, About, and Join Our Team, customer reviews, a frequently asked questions accordion, and a call to action. The About page adds team profiles, access equipment, and a previous-projects list, while the Services page presents twelve services as icon cards.
Motion is kept light. Sections ease in diagonally as they enter the viewport, section reveals respect reduced-motion preferences, and the layout adapts down to small phones with a fixed header and a mobile menu.
The platform
A static site that costs nothing to host.
The site is built with Next.js and exported as plain static files. Page copy, navigation, contact details, and search metadata live in a single versioned content file in the repository, so there is no content management system to subscribe to, patch, or lose access to. Editing a page is a text change and a commit.
Every push to the main branch triggers a GitHub Actions workflow that installs dependencies, runs the build, checks that every route exported correctly, regenerates the robots file and sitemap, and publishes the output to GitHub Pages under the company's own domain. Source code stays in a private repository and only the compiled site is published. GitHub Pages serves it over HTTPS at no cost.
Going live was a DNS change. The domain's web records now point at GitHub Pages, while the company's existing email records were left untouched. The workflow also refuses to build unless the contact-form configuration is present, so a deploy with a broken form cannot happen by accident.
- Static Next.js export Six routes rendered to plain HTML, CSS, and JavaScript
- GitHub Actions publishing Build, validate, and publish on every push to the main branch
- Zero hosting cost GitHub Pages with the company's custom domain and HTTPS
- Versioned content One content file in the repository instead of a CMS subscription
- Search foundations Per-page titles and descriptions, Electrician and FAQ structured data, generated sitemap and robots files
- Optimised media More than 40 worksite photographs, team portraits, and hero video prepared for the web
The free mailing system
A contact form with no server to pay for.
A static site cannot send email on its own, and the usual answers are a paid form service or a hosted function tied to someone's personal email account. Instead, Veloste built a small, isolated Cloudflare Worker that does one job: accept a contact-form submission from goldenelectrical.ca and deliver it to the company inbox through Resend's transactional email API. At launch, both services offered free tiers far above the traffic a local contractor's form will ever see, with Cloudflare Workers allowing 100,000 requests a day and Resend covering 3,000 emails a month.
The Worker is careful about what it accepts. It only answers JSON requests from the site's own origin, validates every field against a strict schema, escapes anything that ends up in the email, discards honeypot submissions silently, verifies a Cloudflare Turnstile token on the server, and rate-limits attempts per visitor address. Messages are sent from a verified sending subdomain so they land in the inbox rather than spam, with the visitor's address set as Reply-To so the office can answer with a single click. API keys exist only as encrypted Worker secrets and are never exposed to the browser.
A unit-test suite mocks both providers, so the Worker can be verified without sending real email. The result is a contact form that behaves like the one on a fully hosted site: instant confirmation for the visitor, a clean email for the office, and no monthly invoice for either.
This case study documents the implemented website and mailer functionality. Veloste does not publish invented traffic, enquiry, or revenue results.