Alpine.js Weekly logo

Alpine.js Weekly

Subscribe
Archives
April 1, 2022

Alpine.js Weekly #86

Tips

Got to love how easy it is to make basic html interactive and animated with Alpine.js :)

x-collapse takes care of all the magic here! https://t.co/UzTV2lVToy

pic.twitter.com/9OzAASLOXw

— Dennis van Dalen @ 🇲🇽 (@dennisvdalen) March 21, 2022

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:

  • fffuel.co/pppalette, a color palette generator, built using Alpine.js by @ffffffuel
  • moneyglance.herokuapp.com, a simple app to write down earnings and expenses of the month with Laravel, Livewire, Alpine and Tailwind by @dnlgrz91
  • voguetyre.com is made with Laravel, Livewire, Alpine and Tailwind by @divtag_it
  • itwillcost.me, a tool built to calculate future potential return on investment using Alpine.js by @AbdelElrafa
  • kandji.io/?aa a Kandji website, built with Eleventy, Alpine, Tailwind and hosted on Netlify by @ItsMeAra

Demos: -Show Hide Input Password Field with Alpine.js by @extralam - Simple Website(TailwindCSS + AlpineJS) by @naveenkharwar21 - Alpine.js + Swap View in Login and Sign up page by @extralam - Umbraco UUI Library Example in Alpine.js by @warrenbuckley, Warren's interested in feedback if anyone has some.

This newsletter supported by my GitHub Sponsors.

Articles & Tutorials

Building a carousel component with TailwindCSS and Alpine.js by @MaciejJanowski

Alpine.js Brings JavaScript Interactivity without Complexity to HTML on @thenewstack by @rwwmike

Bootstrap Toggle clone with Tailwind CSS and Alpine by @wimdeblauwe

Code & Tools

@_marcreichel published a alpine-timeago - a simple Alpine.js plugin to display the human-readable distance between a date and now, github.com/marcreichel/alpine-timeago

Don't miss what's next. Subscribe to Alpine.js Weekly:
This email brought to you by Buttondown, the easiest way to start and grow your newsletter.