oliverdavies.uk/content/node.d411d43b-7c61-4fa1-b41b-4e7ec5eb862c.yml

70 lines
3.5 KiB
YAML

uuid:
- value: d411d43b-7c61-4fa1-b41b-4e7ec5eb862c
langcode:
- value: en
type:
- target_id: daily_email
target_type: node_type
target_uuid: 8bde1f2f-eef9-4f2d-ae9c-96921f8193d7
revision_timestamp:
- value: '2025-05-11T09:00:18+00:00'
revision_uid:
- target_type: user
target_uuid: b8966985-d4b2-42a7-a319-2e94ccfbb849
revision_log: { }
status:
- value: true
uid:
- target_type: user
target_uuid: b8966985-d4b2-42a7-a319-2e94ccfbb849
title:
- value: 'Building a design system in a few hours with Symfony'
created:
- value: '2024-02-27T00:00:00+00:00'
changed:
- value: '2025-05-11T09:00:18+00:00'
promote:
- value: false
sticky:
- value: false
default_langcode:
- value: true
revision_translation_affected:
- value: true
path:
- alias: /daily/2024/02/27/building-a-design-system-in-a-few-hours-with-symfony
langcode: en
body:
- value: |
<p><a href="/podcast/11-mark-conroy">I recently spoke with Mark Conroy</a>, 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.</p>
<p>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.</p>
<p>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.</p>
<p>It was a great opportunity to take Symfony 7 for a spin and explore and test some things that <a href="/podcast/10-ryan-weaver-symfonycasts">Ryan Weaver and I discussed in our episode</a>, such as Symfony UX and Twig components.</p>
<p>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 <code>&lt;twig:Logo /&gt;</code> syntax to include child components.</p>
<p>You can <a href="https://github.com/opdavies/symfony-design-system">view the code on GitHub</a>, and it may be something I use and work on in the future.</p>
format: full_html
processed: |
<p><a href="http://default/podcast/11-mark-conroy">I recently spoke with Mark Conroy</a>, 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.</p>
<p>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.</p>
<p>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.</p>
<p>It was a great opportunity to take Symfony 7 for a spin and explore and test some things that <a href="http://default/podcast/10-ryan-weaver-symfonycasts">Ryan Weaver and I discussed in our episode</a>, such as Symfony UX and Twig components.</p>
<p>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 <code>&lt;twig:Logo /&gt;</code> syntax to include child components.</p>
<p>You can <a href="https://github.com/opdavies/symfony-design-system">view the code on GitHub</a>, and it may be something I use and work on in the future.</p>
summary: null
field_daily_email_cta: { }