Bye jQuery, Hello Alpine?
Is the following exchange with @horse_js a sign of things to come?
jquery was good
— Horse JS (@horse_js) May 28, 2020
Until @Alpine_JS Came.
— Nishant Singh (@_nscs) May 28, 2020
This email is supported by Codecourse. Practical screencasts for developers (including Alpine.js!).
@rbucks seems to think so, he's taking an oath not to touch Bootstrap and go Tailwind + Alpine. @MadeByMayo are already there:
Finally broke free from jQuery 🥳
It's been sat in our framework for sometime, either being used, or not used on a project 👎
But as of today, we're pure JS with a sprinkle of AlpineJS 🧂
— Jason Mayo 🍩 (@MadeByMayo) May 28, 2020
Made with Alpine.js
- @alexpgates is running for his board of education, his site gatesforops.com is built on the TALL stack (Tailwind, Alpine, Livewire, Laravel)
- @justifyagencyhq is relaunching justifyagency.com with Tailwind and Alpine
- @slovenianGooner is working on a cool site with Alpine
- @georgejustin22's pwainside.com is TALL stack in action
- @toomaime from @growthhacklist is looking at Alpine for search functionality.
An Alpine.js success story from @JuanDMeGon
I finally finished replacing all the small Vue.js functionalities with @Alpine_JS.
The JS bundle reduced its size in a 66% 🥳 and I was able to be much more modular by the way 💪
— Web Development Instructor | JuanDMeGon (@JuanDMeGon) May 26, 2020
Articles & Tutorials
Access Alpine.js component data/state from outside its scope by @hugo__df
Build a Multi-room Realtime Chat with Livewire (& Alpine.js) by @teamcodecourse
Demos
- Bootstrap like modal using Tailwind CSS by @tmg_bedus
- A side menu with Tailwind and Alpine by @tonyennis
- Testimonial UI with Tailwind aand Alpine by @mithicher
- Get Random Image ( Cats & Dogs ) by @mr_alaraj
- Kanban Board with TailwindCSS and AlpineJS by @mithicher
- Get Random Quote by @mr_alaraj
For more posts like this, you can join the Alpine.js Handbook Knowledge Base (Paid), it's a great way to support the newsletter and get early access to Alpine.js content.
Code & Tools
This new project "hello-worlds" (github.com/johnpapa/hello-worlds) has an Alpine.js example contributed by @hugo__df.
You can also check out github.com/shatstack/inline-remote-assets - 0-config CSS and JavaScript inlining and purging, designed for users of Alpine.js and TailwindCSS, by @hugo__df.
Tool alert: tailblocks is a simple WYSIWYG for @tailwindcss by @brent_dalling
Releases
Nothing this week but stay tuned, there's a lot of good work going on with new features and bug fixes.