Level 75
Again subjective, I use fetch Js. Used to use jQuery but switched over.
1 like
Apr 22, 2022
14
Level 7
Why do you use AlpineJS? Doesn't seem great.
Hey there!
So I've looked at AlpineJS and I can't see it being that great when used on bigger projects - which would be probably the majority of projects.
The issue I have is that you're basically writing JS inside HTML file basically - its basic Vanilla JS, except instead of selecting elements via the DOM, you do it the alpine way and keep all of the logic in the HTML.
While you can make a true/false dropdown easy, and that is indeed nice, overall I don't see why you woudlnd't do that like bootstrap does when handling JS.
Laravel comes with alpine but that doesn't mean if they do it its the best way and everyone should... I just always remove it.
I googled more about Alpine and google, and even they themself say Alpine is great for small projects - and I can agree on that. But most projects aren't small, which makes no sense too use Alpine.
And yes, I watched the Laracast Alpine tutorial - and that made no sense to me why would someone use Alpine JS.
Plus on something I was coding, I had to vanilla code it anyway - Alpine seems to be bloading and might as well just select things with the DOM and do in in separate file, keep the visual code clean etc...
It didn't even seem THAT flexible in some instances while using Laravel with blade components.
This isn't to do with me not being a Senior either, talked with a top tier senior and he agrees- well, he said that first I went ahead tried to use Alpine anyway.
Just wondering what is your opinion on this as well.
Why do you use it, or why not? What is your experience with it so far etc...
Level 122
@jlrdw hah, funny. Alpine does not do anything with ajax.
Level 75
@Snapey I know what alpine js is, from the description it states:
Alpine is a rugged, minimal tool for composing behavior directly in your markup. Think of it like jQuery for the modern web. Plop in a script tag and get going.
Of course I don't do effects with fetch, I use fetch js and regular javascript now whereas prior I used jquery for both.
But I should have said also in combo with regular JS in my answer.
Level 7
@jlrdw Right, but jQuery these days is very bloated and it was for designers that didn't knew JS - even though jQuery is a masterpiece, you don't need all of it. That's one reason I'm not using it.
Why did you switch from jQuery to regular JS? What made you abandon jQuery?
Level 75
@aurelianspodarec I switched mainly because once I got to experimenting with fetch, I really like its simplicity.
I don't really use effects except for showing and hiding an area and I use modals, so regular javascript Is all I need.
A good series on laracasts is JavaScript for server-side Developers, give it a watch it's real good.
2 likes
Level 7
@jlrdw Hah, funny, its on my right side https://i.imgur.com/30i49nH.png
I'll check that out! I'm gonna watch all of the JS stuff now or at least some, thanks :)
I was just watching more about PHP, and blade and learned a ton, will re-factor my project again - learned quite a few new things still about blade, even though I did watch some blade tutorials before, I suppose its good to go back and re-watch some stuff, gonna pick up other things ^^
With Alpine I feel like it just adds loading and would be better off to write Vanilla JS components library like boostrap and just re-use that, you'd also type less, keep the animations in CSS since they will most likely by similar anyway, I feel like that's simpler.
Edit: Oh funny, I already watched that tutorial lol gonna re-watch it I suppose heh
Level 4
I have found Alpine quite useful to use in WordPress or a similar site that doesn't use a framework for the front end when I just need to make an accordion or something like that.
It just makes things like that more convenient rather than writing the logic/state management myself. I haven't used it for much more than that though.
2 likes
Level 7
@dwcraig Hmm. I can see it being useful in WordPress considering all the functionality is very basic, it'll make sense yeah, could agree with that.
But when thinking about a bit more complicated front-end, I feel like its dirty and might as well use vanilla JS and put that in a JS file instead. And what no you could use React/Vue but I'm not using them.
That's a good point though for WP sites. Though Statamic exists, no need for WP these days! :D
1 like
Level 122
For Laravel sites that are largely Server Side Rendered, Alpine offers clean expressive way to write interaction effects.
3 likes
Level 7
@Snapey I was looking for this https://laracasts.com/series/alpine-essentials/episodes/5 why wouldn't on just write Vanilla JS instead?
1 like
Level 122
@aurelianspodarec because you would be more productive ?
Level 7
@Snapey But if you write one Vanilla JS component, with a class, and make it flexible, then you can easily create very flexible components, no blating HTML and re-use that in all of your projects.
Like boostrap does.
And you would be also saving the amount you have to type - from my point of view at least.
Level 1
@aurelianspodarec I dont't think your html code looks cleaner without alpine. When writing vanilla JS or jQuery we often end up with giving attributes to elements to make them identifiable via JS or giving them initial values which is both not necessary with alpine.
If we consider a simple task like storing a value from an input in a variable your html for a vinilla/jquery implementation looks probably something like this
<input type="text" value="0" id="my_input" />
while your alpine implementation looks like
<input type="text" x-model="mymodel" />
So even with all logic included the alpine implementation looks cleaner than the vanilla implementation without logic.
Also you don't have to include all the logic in the html, you can do complex computations still in an external file and put only the JS code in the html which is tightly related to the interface.
Level 7
@flappix But you gave a simple example here. I'm talking about complicated stuff.
1 like
Please or to participate in this conversation.