Building Our Engineering Website with Astro 5
A behind-the-scenes look at how we built the Godfrey Engineering website using Astro 5, content collections, and Cloudflare Pages.
Why Astro?
When it came time to build the Godfrey Engineering marketing website, we evaluated several frameworks. Astro stood out for its content-first approach, zero JavaScript by default philosophy, and first-class support for content collections with type-safe schemas.
Content Collections
Astro 5’s content collections let us define strict schemas for our blog posts and case studies using Zod. Every field is validated at build time, if a frontmatter field is missing or malformed, the build fails with a clear error message. No more silent bugs from typos in YAML.
const blogSchema = z.object({
title: z.string().min(1).max(100),
description: z.string().min(10).max(300),
publishDate: z.coerce.date(),
// ... more fields
});
Multi-Language Support
With 7 locales to support, we organise content by locale directory. Each post has a translationKey that links it to its counterparts in other languages. The translation switcher in the header automatically finds the matching post.
What’s Next
In upcoming posts, we’ll dive into our GSAP animation system, Three.js integration for the hero section, and how we handle contact form submissions with Cloudflare Workers and Resend.
Stay tuned.