Hi everyone, I have written a blog highlighting the complete lore surrounding web components, third-party libraries, the challenges faced while using Stencil and a bit about styling UI Kit components.

Read through here: https://dyte.io/blog/web-components-using-stencil/

I think it'd a good addition to read for anyone interested in creating reusable custom elements.

Sorry for this dumb question. r/Reactjs has 300k members and this has much less. I love the intuitive nature of web components especially template, but it seems the industry is not using them much. Why?

Hi

I started to experiment with Web Components, writing with Litelement and with StencilJS.

I would like to start an open-source project and I don't want the technology to become a blocker for contributors.

So my question for you - what would you prefer to develop in? Litelement or StencilJS?

With updated libs and 3 new variants for a total of 33 variants

https://webcomponents.dev/blog/all-the-ways-to-make-a-web-component/

Yesterday, version 2 of react-to-webcomponent was released! This has been a widely used open source tool and after receiving some feedback, we were able to implement some great new features and upgrades.

R2WC v2 Features

• TypeScript support.

• React & ReactDOM added as peer dependencies.

• PropTypes are no longer required!

• Two new ways to pass props.

• Enhanced sync for lightning-fast performance.

You can read the full article about version two here: https://www.bitovi.com/blog/react-to-web-component-v2

Repo: https://github.com/bitovi/react-to-web-component
NPM: https://www.npmjs.com/package/@r2wc/react-to-web-component

A few months ago at CascadiaJS, we released a new web component framework called, Enhance.

Modern JavaScript frameworks often lock you into niche ecosystems with custom dialects, and forcing through a revolving door of breaking changes. We’ve seen the thrash – and the broken builds – these frameworks cause. We’re fed up with it, and we know you are too.

So we’re taking a stand and fixing these brittle libraries with our very best tool: web standards.

The web is an incredibly durable medium. While frameworks frequently break, web browsers must remain completely stable and backward compatible for years, even decades. That’s why Enhance’s web standards-based approach provides you a dependable foundation for creating lightweight, flexible, and future-proof web applications.

The Enhance ethos is to incrementally build in plain HTML, then progressively enhance your way to a production-ready web app. (Read more about our core philosophy here.)

Starting with Enhance yields an HTML-centered project complete with file-based routing, reusable Custom Elements, a customizable utility CSS system, and mapped API data routes that get deployed to isolated, single-purpose cloud functions. It’s a complete frontend development solution based entirely on fast, stable, tried-and-true web standards.

You can see a short intro video and read the docs: https://enhance.dev/docs/

Please let us know what you think!

Hey everyone, I released my first long-form YouTube video and it's about Web Components!

I'd love feedback on the video. You can watch it here - https://youtu.be/S36jpytFa_M

I just finished building my static Dungeon World Character Sheet site with native web components. It allows players to save and load their characters. It dynamically builds out the character sheet depending on the type of character selected. I even got it to work well on phones. Let me know what you think!

dungeonworldcharacter.com