DEV Community

Oliver Davies
Oliver Davies

Posted on • Originally published at oliverdavies.uk on

Building a design system in a few hours with Symfony

I recently spoke with Mark Conroy, Director of Development at Annertech, on the Beyond Blocks podcast. We discussed building something useful in a day and building design systems with web components.

Inspired by that conversation, I spent this afternoon experimenting with web components and seeing how I could use them within a design system we're building, as I think they can solve a particular need we have.

Following that, I thought I'd see how I could build my own design system and decided to do it with Symfony and see what I could achieve within a few hours.

It was a great opportunity to take Symfony 7 for a spin and explore and test some things that Ryan Weaver and I discussed in our episode, such as Symfony UX and Twig components.

Each component is a Twig component with its own PHP class and Twig template, which is rendered when I visit its URL, and I can use the HTML-like <twig:Logo /> syntax to include child components.

You can view the code on GitHub, and it may be something I use and work on in the future.

P.S. There's less than a year until Drupal 7's end-of-life date. Plan your upgrade to Drupal 10 now!

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay