Skip to content
All work

1 min read

Charm Industrial

Rebuilding the site Charm Industrial sells through

Visit live site
  • ClientCharm Industrial (via Bejamas)
  • RoleLed the frontend
  • When2023 to 2025
  • 3X

    faster page loads

  • +86%

    performance improvement

  • 30%

    lift in conversions

  • 100k+

    monthly visitors

Charm removes carbon from the atmosphere, and its website is where clients buy. I led the rewrite from Gatsby to Next.js, and built the internal tool that watches their factories.

Charm Industrial homepage with live tonnes of carbon dioxide removed

Context

Gatsby was slow and costly to work in. Plugins bloated the site, and some were deprecated and a security risk. The site needed live data and a modern stack.

What I built

  • charmindustrial.com

    Full rewrite from Gatsby to Next.js with server rendering for live data. Dead code and unused dependencies gone. Stripe checkout takes hundreds of thousands of dollars a month.

    Visit live site
  • Factory video dashboard (private)

    Internal Next.js app with live camera feeds. Express on Render replays Verkada HLS streams to many viewers.

How it's built

The public site is Next.js on Vercel with Stripe. The dashboard is a separate app: one Express service pulls each stream once and fans it out.

charmindustrial.com
  1. Visitor
  2. Next.js and TailwindVercel
  3. Stripe checkoutPayments
Factory dashboard (private)
  1. Verkada camerasHLS (m3u8)
  2. Express on RenderReplays to many viewers
  3. Next.js app
  4. Charm staff

Hard parts

  • Rewriting a site that takes payments without a day of downtime.

    CallRebuilt behind the same Stripe checkout and held 99.9% uptime.

  • Streaming several camera feeds to many viewers without the backend falling over.

    CallOne Express service pulls each Verkada stream once and fans it out, so the cameras see one viewer.

StackNext.jsTailwindFramer MotionStoryblokStripeVercelExpressRender