I’m experimenting with @Alpine_JS and @tailwindui and now I feel like a sorcerer. pic.twitter.com/wW2ExmOhoQ
— Mark Praschan (@MarkPraschan) October 13, 2020
This email is supported by my GitHub Sponsors.
I’ve wondered for a long time which use-case Spruce by @ryangjchandler for @Alpine_JS could have.
Today I’ve found one and it works super easy, impressive and like expected! 🎉🚀
I was able to create a global volume slider for several videos with it. 🤩https://t.co/5pGdbGfh4v— Tom Witkowski (@devgummibeer) October 12, 2020
Tips
Give @Alpine_JS a try! You can sprinkle in tiny amounts of JS in-line with HTML and it’s super approachable.
— Ryan Atkins (@ryatkins) October 12, 2020
As someone who avoids writing JS at any cost, @LaravelLivewire and @Alpine_JS have been a joy to work with and have allowed me to create some pretty interactive apps that I wouldn’t have ever attempted before.
— Brad Kilshaw (@BradKilshaw) October 13, 2020
I described @Alpine_JS like this on a call today: “Imagine if jQuery and Vue had a baby, but they modified the genetics so it was like @tailwindcss but for JavaScript.”
You’re welcome to use that @calebporzio.
— Galen Gidman (@galengidman) October 12, 2020
Made with Alpine.js
If you’ve got something to share with the Alpine.js community, you can submit your link or reach out to me on twitter @hugo__df.
Here are this week’s Alpine.js adopters:
- dcblog.dev by @dcblogdev is build with Laravel, Tailwind/Tailwind UI and Alpine.js
- @fostr_io are revamping their Shopify themes with Alpine.js + Tailwind CSS
Demos:
- a component to create data charts with Livewire, Alpine.js and Chart.js by @asantibanez
- a transition for a navigation menu on mobile by @austriker27
- a demo of an Alpine.js REST API integration by @getJReviews
- a flashcard component with Alpine, Tailwind and Popmotion.js by @miczed
- a TALL international phone number input with Livewire, Squire, Alpine and libphonenumber-js by @danjharrin
- A Livewire, Tailwind and Alpine.js modal by @jtkendall
Articles & Tutorials
Landing Starter Template based on TailwindCSS, AlpineJs and build on esbuild and PostCSS by @witty_prog_blog
[Video] Building a custom select input with Alpine.js and Tailwind CSS by @danjharrin
[Slides + Video] Keeping your head with Magento by @willemwigman on how the future of Magento might leverage Tailwind and Alpine.
The best way to use x-cloak in Alpine JS by @markusantonwolf
Sharing State Between Livewire & Alpine by @tnylea
For more posts like these, you can join the Alpine.js Development Subscription, it’s a great way to support the newsletter and get early access to Alpine.js content.
Code & Tools
hyva.io are fast Magento themes with TailwindCSS and Alpine.js by @willemwigman
Spruce 2.0.0 by @ryangjchandler has been released, the state managamement library for Alpine.js now has persisted stores.