Alpine.js Weekly logo

Alpine.js Weekly

Subscribe
Archives
April 3, 2020

Find out how Alpine.js is built

The series “Building Alpine.js” by Caleb Porzio (creator of Alpine.js) is out, first two episodes: Episode 1 - It All Starts With The Data and Episode 2 - Bringing The DOM To Life.

It turns out 70% of respondents want to use Alpine.js in conjunction with a server-rendering engine, with static site generators and HTML pages coming in at 9.5% and 14.5%, see the poll.

The demos keep rolling in, this week:

  • An Alpine.js GDPR banner demo by @lepikhinb
  • A cool slider by @marcelpociot
  • A multistep form with Alpine & Tailwind by @mithicher
  • A newsletter subscribe form with Alpine & Tailwind by @theasarmah

nutrilogic.mx is made with Alpine.js as per @victoryoalli‘s announcement.

@CoreSkillsHQ is also adopting Alpine.js per @fenskexyz‘s tweet, and their codebase is open source. The templates with Alpine.js are at views/candidate.handlebars & views/layouts/main.handlebars.

Articles & Tutorials

Combine Phoenix LiveView with Alpine.js

Alpine.js: responsive x-cloak by @hus_hmd

Alpine.js Tutorial

What is Alpine.js by @ryangjchandler.

IodineJS — a micro validation library introduction post, the library is inspired by Alpine.js’ philosophy, and created by @mattkingshott.

Code & Tools

See the repo for github.com/mattkingshott/iodine a micro client-side validation library inspired by Alpine.js by @mattkingshott

2.2.4/2.2.5

Fixes

  • fix reactivity of x-if inside of x-for

2.2.3

Features

  • Support for nested x-for (as long as the nested one is wrapped in an element)

2.2.2

Features

  • x-on .debounce.150ms and x-model .debounce
  • improved $watch nested properties support

Fixes:

  • IE11 goes back to the hand-rolled reactivity core
  • Fix to Mutation Observer issue with x-if inside a x-for
  • Fix core debounce issues
  • Removed unnecessary $nextTick stack clearing
  • Make x-model.number casting to be more like Vue
Don't miss what's next. Subscribe to Alpine.js Weekly:
Powered by Buttondown, the easiest way to start and grow your newsletter.