←back to thread

Vanilla JavaScript support for Tailwind Plus

(tailwindcss.com)
304 points ulrischa | 3 comments | 25 Jul 25 18:11 UTC | HN request time: 0s | source
Show context
judah ◴[25 Jul 25 19:20 UTC] No.44687229[source]▶
Looks like it's done using standards-based web components[0]. The page says these components don't require any existing JavaScript framework; because web component support is built-in to the browser.

Nice to see devs picking up web components.

[0]: https://developer.mozilla.org/en-US/docs/Web/API/Web_compone...

replies(4): >>44687259 #>>44687425 #>>44688701 #>>44690588 #
reactordev ◴[26 Jul 25 01:49 UTC] No.44690588[source]▶
12 years I’ve been saying this… 12, damn, years. React graduates look at me crazy. Angular devs say it’s not needed anyway. Svelte bros say get bent. I’m so happy that someone is paying attention.

You don’t need a shadow dom, you don’t need rerendering of everything when a simple value changes. You simply need web components and scoped js/ts with vite or whatever rollup you use.

replies(1): >>44692769 #
1. JoeyJoJoJr ◴[26 Jul 25 09:45 UTC] No.44692769[source]▶
Can you point to any example projects or a todo list app that shows how modern web component can be utilized.
replies(2): >>44693879 #>>44696067 #
2. bmare ◴[26 Jul 25 13:19 UTC] No.44693879[source]▶
Here's a great one: https://plainvanillaweb.com/pages/components.html
3. reactordev ◴[26 Jul 25 18:31 UTC] No.44696067[source]▶
Sure

    class App extends HTMLDivElement {}

    customElements.define(“main-app”, App)

    <body><main-app/></body>
This is the simplest web component.

More examples:

https://github.com/mdn/web-components-examples