Alpine.js Weekly - Alpine.js Weekly #61

Tips

replace the turbo-frame with @Alpine_JS $fetch, no code replaced needed. perfect for django.

— Andres 🐍 python3.ninja (@zodman) May 15, 2021

This newsletter supported by my GitHub Sponsors.

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:

• biggerpockets.com/blog as well as biggerpockets.com/glossary and biggerpockets.com/learn are powered by a custom WordPress theme built with Tailwind, Alpine, and Spruce for state management. by @Joey_Farruggio
• minicarmessina.com/configuratore/ is built with Alpine
• highscore.domains got a darkmode toggled powered by Alpine and TailwindUI by @onerinas
• dcblog.dev is built with Laravel, Tailwindcss and a sprinkling of Livewire/Alpine.js, by @dcblogdev

Demos:

• Alpine.js and TailwindCSS fun implementing drag and drop by @soulchildpls
• Navbar built with TailwindCSS & AlpineJS by @mithicher
• Cool Hamburger animation with Tailwind and Alpine by @LarsKlopstra
• Tailwind for print design, cyclist id card design missing some Alpine sprinkles to make it editable and generate the final pdf for print. by @ajitbohra
• Dashboard boxed layout with company logo, responsive horizontal navigation and working dropdown with Alpine by @pixelcave_john
• Dropdown UI component with working variation using Alpine by @pixelcave_john

Articles & Tutorials

An Alpine.js Cheatsheet Made With Alpine.js by @JamesAuble, the cheatsheet is at xcheat.jamesauble.com

Displaying data (an array of objects) using Alpine JS in a table by @anjanesh

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

For Laravel users, @danjharrin and @ryangjchandler have released a backend communication layer for Alpine: github.com/radio-js/radio.

Adopter Reactions

Current status: doing extremely naughty things with @GoHugoIO, @Alpine_JS, @tailwindcss, and CUE.

— Cheugy Howser, MD (@lucperkins) May 19, 2021

Loving @Alpine_JS. One cute little demon in front-end!

— Sabbir Hasan (@iamsabbir_dev) May 15, 2021