April 16, 2021, 6 p.m.

Alpine.js Weekly #57

Alpine.js Weekly

“Q1 2021 State Of JavaScript Libraries and Tools: Frameworks” report is out πŸŽ‰πŸŽ‰πŸŽ‰ https://moiva.io/blog/2021-q1-state-of-js-frameworks
Best Q1 2021 Top Performers:@reactjs @Alpine_JS @solid_js @angular
Marko (@MarkoDevTeam)#js #moiva #report pic.twitter.com/cQvaMW5CZN

β€” Alexey Antipov 🐟 Moiva.io 🐟 (@_aantipov) April 13, 2021

This newsletter supported by my GitHub Sponsors.

Tips

πŸ”₯ #alpineJS tip

When building in CMS-land I recently started using x-for from @Alpine_JS to template out HTML quickly where the CMS fields haven’t been created yet.
(The same idea can be used with components)

It works great in @CraftCMS, @statamic or whatever CMS you use!

pic.twitter.com/mGzByzYhiw

β€” David A. Lindahl (@austriker27) April 15, 2021

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:

  • asn.org.uk has been rebuilt with Alpine and Tailwind. The site-wide notice uses madmurphy/cookies.js and a content hash-based cookie. Thanks to @mattradford for sharing & building.
  • insectecofood.com is built on Drupal 9 with Alpine.js and TailwindCSS/UI, by @sinyayadynya
  • clubstudio.co.uk is built with CraftCMS, Tailwind and Alpine, by @scottpwakefield
  • ta-styled-plugins.com is built with Alpine & Tailwind, by @markusantonwolf

Demos:

  • Profile card with inline editing using Alpine.js & WindiCSS by @rehhouari
  • Class Toggle comparing Vanilla JS, jQuery, and Alpine.js by @Joey_Farruggio is built with Alpine
  • Team Section - Hover Animation by @alipanick
  • Tom select initialisation with Alpine by @hugronaphor

Articles & Tutorials

How to make your Web Pages look Prettier with Alpine.js

Let’s Build An Instagram Clone With The PETAL(Phoenix, Elixir, TailwindCSS, AlpineJS, LiveView) Stack by @elixirprogrammr

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

@markusantonwolf‘s TA-Gallery got a docs makeover & new features: ta-styled-plugins.com/ta-gallery/

@ryangjchandler has released Spruce 2.7.0.

Adopter Reactions

Looks like Hugo + inline partials + tailwind + alpinejs might be a pretty nice combo for fast static sites.

β€” Michael Bromley (@michlbrmly) April 12, 2021

You just read issue #57 of Alpine.js Weekly. You can also browse the full archives of this newsletter.

Share on Facebook Share on Twitter Share via email
Brought to you by Buttondown, the easiest way to start and grow your newsletter.