31 lines
1.6 KiB
Markdown
31 lines
1.6 KiB
Markdown
|
---
|
||
|
|
title: Building a design system in a few hours with Symfony
|
||
|
|
date: 2024-02-27
|
||
|
|
permalink: archive/2024/02/27/building-a-design-system-in-a-few-hours-with-symfony
|
||
|
|
tags:
|
||
|
|
- softare-development
|
||
|
|
- symfony
|
||
|
|
- php
|
||
|
|
- podcast
|
||
|
|
cta: d7eol
|
||
|
|
snippet: |
|
||
|
|
Today, I started a design system with Symfony in a few hours, based on recent podcast episodes with Mark Conroy and Ryan Weaver.
|
||
|
|
---
|
||
|
|
|
||
|
|
[I recently spoke with Mark Conroy][mark], 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][ryan], 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][repo], and it may be something I use and work on in the future.
|
||
|
|
|
||
|
|
[mark]: {{site.url}}/podcast/11-mark-conroy
|
||
|
|
[repo]: https://github.com/opdavies/symfony-design-system
|
||
|
|
[ryan]: {{site.url}}/podcast/10-ryan-weaver-symfonycasts
|