
AlpineJS Guides and Examples - stanislavb
https://www.alpinetoolbox.com/
======
shubhamjain
I have been using AlpineJS for a while, and I absolutely love it. It's a
minimal, very lightweight and forms the perfect bridge between jQuery and
Vue.js. Nothing against jQuery, but DOM manipulation isn't ideal and it tends
to get messy. I am not a fan of frameworks either unless I am sure I need to
build a rich, dynamic app.

AlpineJs allows me to create those little dynamic stuff that website often
needs: form validations, modals, filters, dynamic dropdowns, tooltips etc.
This is much better option than hunting for libraries that to do simple stuff
like that, or using jQuery.

AlpineJs + TailwindCSS is a highly recommended stack for anyone who wants to
get things done fast.

~~~
pibefision
I would like to recommend Kutty as a component framework that is using
Tailwind + AlpineJS.
([https://kutty.netlify.app/](https://kutty.netlify.app/))

Any other similar recommendation?

~~~
tbran
Is this yours?

htmx [1] (by the guy who created intercooler.js) was renamed from "kutty" to
"htmx" after this comment [2]:

> YSK that in Dutch the name kutty resembles the popular term for the female
> reproductive organs.

[1]: [https://htmx.org/](https://htmx.org/)

[2]:
[https://news.ycombinator.com/item?id=23196095](https://news.ycombinator.com/item?id=23196095)

~~~
praveenjuge
lol well time for a name change, but I don't know what to change it to

------
capableweb
At first I thought this was a JS port of Alpine Linux and got very excited!
Then I remembered I already came across that before, so I shouldn't have
gotten that excited...
[https://bellard.org/jslinux/vm.html?url=alpine-x86-xwin.cfg&...](https://bellard.org/jslinux/vm.html?url=alpine-x86-xwin.cfg&mem=256&graphic=1)

~~~
stanislavb
Yup, the name is a bit confusing.

------
aosaigh
I've used it on a few sites and really liked its simplicity. It's Tailwind for
JS.

That said, does AlpineJS offer any framework for extension? What I mean is the
ability to build on it with custom JS to create custom small components on the
page? I know that it's not necessarily intended to to this, but I find this is
the gulf between "do it yourself" and "use Vue/React/..." that is hard to
fill.

For example, with Tailwind I can use @apply to build my own class-based CSS
components if I really need to. 90% of the time I shouldn't need to do this,
but the reality is there's 10% of the time when Tailwind doesn't cover my use
case.

Does Alpine have this?

~~~
simplify
Maybe custom elements would help? [https://developer.mozilla.org/en-
US/docs/Web/Web_Components/...](https://developer.mozilla.org/en-
US/docs/Web/Web_Components/Using_custom_elements)

There's also spruce when you need to share data across components
[https://github.com/ryangjchandler/spruce](https://github.com/ryangjchandler/spruce)

------
3stripe
Another member of the AlpineJS fanclub here, no more jQuery, and no longer
feel like I need to invest days and days learning Vue (which I never quite get
round to).

We use Alpine + [https://tachyons.io/](https://tachyons.io/) for CSS (powered
by Craft CMS) on almost all our projects now.

------
jgalt212
> if you already know Vue, you basically know Alpine, making it perfect for
> Vue developers to turn to for projects where Vue is simply overkill

So funny to read this, as this value prop was the reason our team to chose Vue
a few years back instead React/Angular.

------
tyingq
_" Alpine requires absolutely no build, you simply include the library and
away you go, all features included."_

Interesting. Maybe an easier path for those trying to get away from jQuery.

------
sebastianconcpt
How would it be if compared to Svelte?

~~~
_heimdall
It doesn't require a build step at all, and really lends itself well to static
sites. I have used Svelte for years and its still my go-to for web apps, but
honestly 95% of the projects I take on are better dealt with as a largely
static site than a PWA. We can thank react for how many basic content sites
come along with JS runtimes running in the background.

I do like Alpine, but after having used it on a few projects it kind of sits
in a dead zone for me. I first used it for a mobile menu toggle and a couple
other small bits of interactivity, but realized I might as well just right
that little bit of JS myself and inline it to save the roundtrip dependency.
If I need more JS functionality like shared, client side state management I'll
go back to Svelte

~~~
sebastianconcpt
Very interesting. In the last year I've been doing backend but I see myself
easily leaning to this too for fullstack needs. Thanks for the input

