#webcomponentsadvent — Public Fediverse posts
Live and recent posts from across the Fediverse tagged #webcomponentsadvent, aggregated by home.social.
-
The #WebComponentsAdvent is over, and I'm doing some finishing touches before making it #opensource next week. Then I'll work on updating the Awesome #WebComponents list. By the way, if you like it, give it a star on #GitHub!
-
The #WebComponentsAdvent is over, and I'm doing some finishing touches before making it #opensource next week. Then I'll work on updating the Awesome #WebComponents list. By the way, if you like it, give it a star on #GitHub!
-
#WebComponentsAdvent Day 24: Who to Follow.
Today is not #FollowFriday but I'm still glad to share the final day of this series about #WebComponents, which is dedicated to all the awesome folks in the #fediverse community who #useThePlatform and rely on web standards. This project wouldn't be possible without your work!
-
#WebComponentsAdvent Day 24: Who to Follow.
Today is not #FollowFriday but I'm still glad to share the final day of this series about #WebComponents, which is dedicated to all the awesome folks in the #fediverse community who #useThePlatform and rely on web standards. This project wouldn't be possible without your work!
-
#WebComponentsAdvent Day 23: Starter Templates.
If you want to start creating #WebComponents, today's update is for you! Meet the list of starters kits with @vite, #buildWithLit, #vue, #svelte, FAST, Shoelace, other libraries and tools.
-
#WebComponentsAdvent Day 23: Starter Templates.
If you want to start creating #WebComponents, today's update is for you! Meet the list of starters kits with @vite, #buildWithLit, #vue, #svelte, FAST, Shoelace, other libraries and tools.
-
#WebComponentsAdvent Day 22: Talks and Recordings.
Unlike fancy frameworks, #WebComponents don't make so much noise at modern frontend conferences and don't produce so much wow among #javascript developers. But I still have some great talks to share with you today:
-
#WebComponentsAdvent Day 22: Talks and Recordings.
Unlike fancy frameworks, #WebComponents don't make so much noise at modern frontend conferences and don't produce so much wow among #javascript developers. But I still have some great talks to share with you today:
-
#WebComponentsAdvent Day 21: Case Studies.
Today's update is a list of real-world cases and stories shared by different teams who used #WebComponents in production. Do check it out especially if you consider using #CustomElements or #ShadowDOM in your project.
-
#WebComponentsAdvent Day 21: Case Studies.
Today's update is a list of real-world cases and stories shared by different teams who used #WebComponents in production. Do check it out especially if you consider using #CustomElements or #ShadowDOM in your project.
-
#WebComponentsAdvent Day 20: Standalone Elements.
Do you remember the old motto "there is an element for that"? While we don't have a new version of the #WebComponents catalog out yet, I got you covered! Meet the list of awesome standalones (more to come later):
-
#WebComponentsAdvent Day 20: Standalone Elements.
Do you remember the old motto "there is an element for that"? While we don't have a new version of the #WebComponents catalog out yet, I got you covered! Meet the list of awesome standalones (more to come later):
-
#WebComponentsAdvent Day 19: Showcase.
I enjoy reading the stories shared by developers who build #WebComponents. Despite years of experience in the field, I often learn a lot from their challenges, mistakes and pain points. Here's some reading I recommend:
-
#WebComponentsAdvent Day 19: Showcase.
I enjoy reading the stories shared by developers who build #WebComponents. Despite years of experience in the field, I often learn a lot from their challenges, mistakes and pain points. Here's some reading I recommend:
-
@bp Sure. Some sections are still a bit outdated because I was busy with #WebComponentsAdvent lately, and the blackout last week made it a challenge. I'll get to polishing the content during the holidays.
-
@bp Sure. Some sections are still a bit outdated because I was busy with #WebComponentsAdvent lately, and the blackout last week made it a challenge. I'll get to polishing the content during the holidays.
-
@DavidDarnes Say no more! The #WebComponentsAdvent that I'm working on is basically just a bunch of links. Plain #html and no #javascript whatsoever.
-
@DavidDarnes Say no more! The #WebComponentsAdvent that I'm working on is basically just a bunch of links. Plain #html and no #javascript whatsoever.
-
#WebComponentsAdvent Day 18: Testing Solutions.
While JSDOM supports #WebComponents, it's usually better to test them in real browsers that people actually use. Today's update provides examples of using Web Test Runner by #ModernWebDev, #Cypress, #Playwright and other tools.
-
#WebComponentsAdvent Day 18: Testing Solutions.
While JSDOM supports #WebComponents, it's usually better to test them in real browsers that people actually use. Today's update provides examples of using Web Test Runner by #ModernWebDev, #Cypress, #Playwright and other tools.
-
#WebComponentsAdvent Day 17, Part 2: Polyfills and Shims.
Experimental features related to #WebComponents are usually supported only by a subset of browsers. But you can still try them in your projects using polyfills. Here you can find several options:
-
#WebComponentsAdvent Day 17, Part 2: Polyfills and Shims.
Experimental features related to #WebComponents are usually supported only by a subset of browsers. But you can still try them in your projects using polyfills. Here you can find several options:
-
#WebComponentsAdvent Day 17: Proposals and Drafts.
While #WebComponents in general have great browser support, there are still some important proposals and drafts currently being discussed, prototyped and implemented. Today's update is a list of relevant materials.
-
#WebComponentsAdvent Day 17: Proposals and Drafts.
While #WebComponents in general have great browser support, there are still some important proposals and drafts currently being discussed, prototyped and implemented. Today's update is a list of relevant materials.
-
#WebComponentsAdvent Day 16: Documenting.
Today's update is about Custom Elements Manifest and various tools for documenting #WebComponents. This is essential to enable IDE support and code completion for better developer experience.
-
#WebComponentsAdvent Day 16: Documenting.
Today's update is about Custom Elements Manifest and various tools for documenting #WebComponents. This is essential to enable IDE support and code completion for better developer experience.
-
#WebComponentsAdvent Day 15: Opinions and Takes.
People have been talking about #WebComponents for years. Today's update includes 20 articles from different developers with their criticism, rant and praise. And this is still not a comprehensive list!
-
#WebComponentsAdvent Day 15: Opinions and Takes.
People have been talking about #WebComponents for years. Today's update includes 20 articles from different developers with their criticism, rant and praise. And this is still not a comprehensive list!
-
#WebComponentsAdvent Day 14: Frameworks Recipes.
#WebComponents can be used with any frontend framework, like #react, #angular, #vue, or #svelte. Today's update describes some approaches and techniques you might need to use for better developer experience.
-
#WebComponentsAdvent Day 14: Frameworks Recipes.
#WebComponents can be used with any frontend framework, like #react, #angular, #vue, or #svelte. Today's update describes some approaches and techniques you might need to use for better developer experience.
-
#WebComponentsAdvent Day 13: Styling Options.
Styling #WebComponents is a huge topic: new #CSS selectors, custom CSS properties, Constructable Stylesheets... Some people suggest to ditch #ShadowDOM, others want to use #Tailwind. Let's dive into it!
-
#WebComponentsAdvent Day 13: Styling Options.
Styling #WebComponents is a huge topic: new #CSS selectors, custom CSS properties, Constructable Stylesheets... Some people suggest to ditch #ShadowDOM, others want to use #Tailwind. Let's dive into it!
-
#WebComponentsAdvent Day 12: Guides and Tutorials.
There are many questions to answer when creating #WebComponents: which library to use, how to handle data and state, etc. Here is a list of articles that give some answers (with more to be added later).
-
#WebComponentsAdvent Day 12: Guides and Tutorials.
There are many questions to answer when creating #WebComponents: which library to use, how to handle data and state, etc. Here is a list of articles that give some answers (with more to be added later).
-
#WebComponentsAdvent Day 11: Best Practices.
Unlike full-blown frameworks, #WebComponents do not enforce you to code in a certain way. Check out the today's update to learn about important things to consider and to avoid making common mistakes.
-
#WebComponentsAdvent Day 11: Best Practices.
Unlike full-blown frameworks, #WebComponents do not enforce you to code in a certain way. Check out the today's update to learn about important things to consider and to avoid making common mistakes.
-
#WebComponentsAdvent Day 10: Codelabs.
If you are new to Web Components and don't know where to start, today's update is for you! Check out codelabs: detailed step by step tutorials created by #buildWithLit, Chrome Developers and #OpenWc teams:
-
#WebComponentsAdvent Day 10: Codelabs.
If you are new to Web Components and don't know where to start, today's update is for you! Check out codelabs: detailed step by step tutorials created by #buildWithLit, Chrome Developers and #OpenWc teams:
-
#WebComponentsAdvent Day 9: Component Libraries.
Apart from #designsystems, today there is a plenty of other use cases for #WebComponents: CMS, scientific writing, 2D and 3D scenes and even creating VS Code extensions. Check out the today's update to discover more:
-
#WebComponentsAdvent Day 9: Component Libraries.
Apart from #designsystems, today there is a plenty of other use cases for #WebComponents: CMS, scientific writing, 2D and 3D scenes and even creating VS Code extensions. Check out the today's update to discover more:
-
#WebComponentsAdvent Day 8: Design Systems.
Today many companies build their #designsystems using #WebComponents. This is especially important for enterprise scale companies and teams that create apps using different frameworks. Here you can find a bunch of examples:
-
#WebComponentsAdvent Day 8: Design Systems.
Today many companies build their #designsystems using #WebComponents. This is especially important for enterprise scale companies and teams that create apps using different frameworks. Here you can find a bunch of examples:
-
Some notable projects from the today's #WebComponentsAdvent update whose maintainers have already joined Fediverse:
- Lit: @justinfagnani @graynorton,
- WebC: @zachleat,
- Enhance: @tbeseda.I'm pretty sure there are more people working on #WebComponents here. Let's get in touch, and please let me know if I missed someone!
-
Some notable projects from the today's #WebComponentsAdvent update whose maintainers have already joined Fediverse:
- Lit: @justinfagnani @graynorton,
- WebC: @zachleat,
- Enhance: @tbeseda.I'm pretty sure there are more people working on #WebComponents here. Let's get in touch, and please let me know if I missed someone!
-
#WebComponentsAdvent Day 7: Libraries and Tools.
The key benefit of Web Components is interoperability. You can create a web component with any library that produces standards based custom elements. Check out the today's update to discover some options:
-
#WebComponentsAdvent Day 7: Libraries and Tools.
The key benefit of Web Components is interoperability. You can create a web component with any library that produces standards based custom elements. Check out the today's update to discover some options:
-
Excited to see my #WebComponentsAdvent in the latest @smashingmag newsletter! There are many other interesting projects there, definitely worth checking out:
https://www.smashingmagazine.com/the-smashing-newsletter/smashing-newsletter-issue-382/
-
Excited to see my #WebComponentsAdvent in the latest @smashingmag newsletter! There are many other interesting projects there, definitely worth checking out:
https://www.smashingmagazine.com/the-smashing-newsletter/smashing-newsletter-issue-382/
-
#WebComponentsAdvent Day 6: Form Participation.
Web Components are part of the #html standard, but they have caveats and limitations when it comes to native forms support. Here you can find some articles that describe existing #WebComponents problems and solutions.
-
#WebComponentsAdvent Day 6: Form Participation.
Web Components are part of the #html standard, but they have caveats and limitations when it comes to native forms support. Here you can find some articles that describe existing #WebComponents problems and solutions.
-
#WebComponentsAdvent Day 5: Accessibility.
When building custom controls for creating interfaces, making them accessible is a must. This requirement applies to web components, too. However, there are caveats related to Shadow DOM that make it tricky.
-
#WebComponentsAdvent Day 5: Accessibility.
When building custom controls for creating interfaces, making them accessible is a must. This requirement applies to web components, too. However, there are caveats related to Shadow DOM that make it tricky.
-
In case you missed it, #WebComponentsAdvent project now covers:
- Custom Elements: https://webcomponents.today/custom-elements/
- Shadow DOM: https://webcomponents.today/shadow-dom/
- HTML templates: https://webcomponents.today/html-templates/These are 3 pillars of #WebComponents (and each has use on its own).
This week, we will explore some practical examples. Stay tuned! -
In case you missed it, #WebComponentsAdvent project now covers:
- Custom Elements: https://webcomponents.today/custom-elements/
- Shadow DOM: https://webcomponents.today/shadow-dom/
- HTML templates: https://webcomponents.today/html-templates/These are 3 pillars of #WebComponents (and each has use on its own).
This week, we will explore some practical examples. Stay tuned! -
@humbird0 There are some proposals related to enhancing the template element with new capabilities. More on that later, there's going to be a dedicated day about proposals in my #WebComponentsAdvent series.
-
@humbird0 There are some proposals related to enhancing the template element with new capabilities. More on that later, there's going to be a dedicated day about proposals in my #WebComponentsAdvent series.
-
#WebComponentsAdvent Day 4: Templates.
When discussing #WebComponents, we often forget about the <template> element, which was among the original proposals. Actually, it is quite a useful part of #html, definitely worth exploring. These articles could help to learn more:
-
#WebComponentsAdvent Day 4: Templates.
When discussing #WebComponents, we often forget about the <template> element, which was among the original proposals. Actually, it is quite a useful part of #html, definitely worth exploring. These articles could help to learn more:
-
#WebComponentsAdvent Day 3, part 2: Shadow Parts.
Styling #WebComponents with Shadow DOM has been quite painful until we got cross browser support for ::part() since Safari 13.1. Here are some posts that describe it, including an article by yours truly from 2020:
-
#WebComponentsAdvent Day 3, part 2: Shadow Parts.
Styling #WebComponents with Shadow DOM has been quite painful until we got cross browser support for ::part() since Safari 13.1. Here are some posts that describe it, including an article by yours truly from 2020: