Frontmatter

Guides

Frontend to backend handoff — HTML design to PHP or Twig templates

Handing off a frontend design to a backend developer is where most projects lose time and consistency. The design is done. The HTML and CSS work. Then someone has to manually convert every component into PHP partials or Twig templates - naming variables on the fly, guessing which values are dynamic, producing output that the backend developer has to reverse-engineer.

This guide covers the full process: from a static HTML/CSS design to a documented, backend-ready render pack - Twig for Symfony and Drupal, plain PHP for WordPress and custom backends. Most frontend developers hand off either a Figma file or HTML prototype, or a partially converted set of templates. What a backend developer actually needs is named templates, a consistent variable contract, and a document listing exactly what each template expects. That's what a proper handoff produces.

Astro's component model - typed Props interfaces, one layout per page, explicit slot declarations - maps mechanically to both Twig and PHP. Using Astro as a structured intermediate step gives you a typed, validated component contract, predictable conversion rules, and automated output via Frontmatter Solo.

The handoff is not a Notion doc. It is a contract. Frontmatter Solo turns the Astro source into templates, a manifest, and integration docs that the backend developer can use immediately.