Write plain html and unlock the power of web components NO BUILD STEP, and with as little "Magic" as possible,
I think every front end developer got hyped when when webcomponents were announced
Advect brings locality of behavior to web compenents.
On the web we have 3 types of html content
- Plain Jane html
npm
npx jsr add @advect/advectpnpm
pnpm dlx jsr add @advect/advectbun
bunx jsr add @advect/advectyarn
yarn dlx jsr add @advect/advectdeno
deno add @advect/advect<!-- import advect -->
<script src="advect.js"></script>
<!--
define a webcompnent with a template tag that has a "adv" attribute
the id will become the tag of the new component in this case "my-btn"
-->
<template id="my-btn" adv>
<!-- style the new compnent -->
<style>
:host{
button {
color:blue;
}
}
</style>
<button>
<slot name="name">Default Name</slot>
<slot name="icon">🤯</slot>
</button>
</template>
<!-- Now your web compnent is ready to use -->
<my-btn>
<span slot="name">New icon / name</span>
<span slot="icon">😉</span>
</my-btn>
<my-btn onclick="alert('unless you want to')">
<span slot="name">No JS</span>
<span slot="icon">😍</span>
</my-btn>- HTMX Compatibility
- HATEOS
- Lit, Alpine,