Alpine.js Weekly #50
Here are this week’s Alpine.js adopters:
- artmuseumgr.org by @onedesignco is built with Alpine.js
- proagentboard.com is built with Alpine, Tailwind and Laravel by @BotezatuDima
- laracon.net is built with Tailwind, Alpine, Vite by @Caneco
- @hyva_io sites: limburgiavlaai.nl, uitgeverijpluim.nl, die-ballondrucker.de and batirmoinscher.com are leveraging Alpine
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.
This email is supported by my GitHub Sponsors.
Demos:
- Alpine and Tailwind Tab Bar by @LarsKlopstra
- Alpine.js + TailwindCSS Lightbox Modal by Apatrid by @TwComponents
- Multi Range Slider with Alpine.js by t7team by @TwComponents
- Analytics Card with AlpineJS by Scott Windon by @TwComponents
- Stock Chart with AlpineJS and ChartsJS by Scott Windon by @TwComponents
- Color Picker with TailwindCSS and AlpineJS by mithicher by @TwComponents
- A minimal and accessible web application signup form using Tailwind and Alpine by @BrentArcane
Articles & Tutorials
[Chinese] HOWTO: 如何学习 Alpine.js a complete guide for newbies who want to learn Alpine.js by @xiqingongzi
[French] [Video] Alpine.js le micro-framework pour frontend by @Evilznet
[Video] Introducing Presto: Syntactically-natural, no-JS HTML Componentization — for Alpine JS by @stephancasas
Setting up dark mode with Tailwind CSS and Alpine.js by @jase_languasco
How to create an Image Upload Viewer with Alpine.js by @Tiago_Ferat
[Russian] Создаём To-do List на Alpine.js by @maxsite
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
The Magic Helpers project for is now at version 1.0! $component and $parent helpers are functionally in line with a native Alpine component, see the release github.com/alpine-collective/alpine-magic-helpers/releases/tag/v1.0.0, props to @kevinbatdorf for his work on this.
Adopter Reactions
Working with Bootstrap and jQuery again feels like such a chore after so long working with @tailwindcss and @vuejs or @Alpine_JS.
— George Buckingham (@gbuckingham89) February 17, 2021
oh wow @Alpine_JS is great for basically anything i didn’t want to use jQuery in the first place anyways
— Gregor Vostrak (@introsort) February 17, 2021
I support @calebporzio because i’m on the verge of replacing a 300kb Vue based form with 40kb of @Alpine_JS javascript. All the heart. Thank you Caleb.
— awcodes (@awcodes1) February 16, 2021
Plus j’utilise @tailwindcss plus je reprends plaisir à faire du front 😍
Et je ne me suis pas encore penché sur @Alpine_JS, ce sera la prochaine étape !Manque qu’à retravailler les pages CV et contat et je pourrais enfin mettre en ligne mon blog sous @eleven_ty \o/
— Franck 🍋👨🏻💻 (@furankum) February 16, 2021
AlpineJS may be ugly as hell to look at but it works really beautifully. I’ve just used it to add Show/Hide Password functionality to a project in about 2 minutes, replacing “Confirm Password” - most users seems to prefer that approach.
— Code With Feeling (@codewithfeeling) February 15, 2021
Designing landing pages with @tailwindcss feels like cheating. This is currently a work in progress and not finished yet, but it took less than two hours to build this and it is fully responsive and includes a toggle (@Alpine_JS) for mobile navigation. pic.twitter.com/gOiu19NZRf
— Dominik Geimer (@DominikGeimer) February 15, 2021
W/o so many optmizations the Lighthouse score is pretty good.
The website is also using just a little bit of @Alpine_JS , and some custom API to connect to Facebook content.
THANK YOU for all these great tools and ressources, definitely deserve more visibility in France ! pic.twitter.com/oEduYUPETT— Baptiste Turquet (@baptisteturquet) February 14, 2021
Alpine.js is amazing, I don’t know why I waited so long to try it.
Feels like Tailwind & Vue, but is super minimal and works well with SSR applications!
— Daksh 👨💻🙅♂️ (@dakmig) February 14, 2021
I have put off looking at the core technologies behind @Hyva_io because I’ve not been in the best headspace to look at new tech.
Consider me sold on @tailwindcss and @Alpine_JS now that I’ve looked at them tonight.
I know what my next web project will be using!
— indefinite[dev]il (@indefinitedevil) February 12, 2021
The 2021 SaaS startup stack:
- Laravel & Spark
- Tailwind CSS
- Alpine JS
- Digital Ocean (Droplets/App Platform)#startup #Laravel #business
— Vaugen Wakeling (@vaugenwake) February 13, 2021