Anyone using Alpine.js?

Hey there!

Are any of you using Alpine.js in your Pinegrow projects? I recently discovered it and I think it would make a nice addition to the Pinegrow workflow. It doesn’t require any bundlers and as such can work seamlessly with server driven projects like WordPress sites built with Pinegrow, adding reactivity and easy client side rendering where necessary.

I would highly advice anyone here to take a look at it:

And for those of you who want to go a step further, Alpine also has an optional state management tool called spruce:

@Roel, thanks for the links–this helped me immensely.

I have a few projects in React that I would really love to use Pinegrow with, but it’s been a challenge. Do you have any advice?

Sorry to dissapoint you but no… I have no idea how to use React to begin with. I have occasionally dabbled in Vue.js and Svelte.js but for the most part the added complexity of such opinionated frameworks put me off and as a result their supposed benefit largely escapes me… That’s mainly the reason why Alpine.js caught my attention as it is much simpler (“you get the keep your DOM”, the exact words of Alpine’s creator…) and have a large interest in libraries like </> htmx - high power tools for html. Plus also the fact that I mainly use Pinegrow with its WordPress theme creator. WordPress is a server driven application and I don’t really see a point in trying to circumvent that with dragging the templating into the client side (as React does). And Alpine provides the tools I need when it makes more sense to render something client side as opposed to the server side without all the added fuss… Sure, the native block API for Gutenberg is written in React but as you said yourself, Pinegrow and React don’t mix well. As such I rely on ACF blocks for my Gutenberg focused projects which work together with Pinegrow prefectly! (sometimes there is a little trick to it, such as emlploying the shadow DOM to isolate styles from the editor but overall it’s a good way of doing things as Pinegrow’s native WordPress components just … work… with this approach). Then again, I mainly style myself as a designer (Full-stack designer, but still a designer…) rather than a developer. Though recently I also tend to introduce myself as a “Low-code professional” as I have also branched out into low-code platforms such as Microsoft PowerApps. And as Pinegrow is also a “Low-code” tool (at least, I use it as one…) it’s right up my alley!

2 Likes

It seems like Pinegrow is going to mix well with my server architecture of choice, which is Django. I’m pretty excited to find that Alpine.js and Tailwind work into that flow.

1 Like

Love your answer @Roel

I’ve stumbled upon Unpoly, which might be also an interesting library for you.
It aims to make server-side web application possible with minimal changes to existing code.

The people behind Unpoly also explain their story behind it here:
http://triskweline.de/unpoly-rugb/#/

@m-artin Hey and thanks!

I’ve heard of Unpoly but I have yet to test it extensively. My first impression is that it is rather similar to HTMX but with more features (some of which seem to overlap with Pinegrow’s interactions plugin which I also have). The presentation seems very interesting, I’ll be sure to take a look!

Thanks for sharing the details about Alpine…

Please continue sharing your experience on building Alpine based apps using Pinegrow… Are you able to use Pinegrow as it is?