Alpine.js Weekly logo

Alpine.js Weekly

Subscribe
Archives
September 18, 2020

Do tools like Alpine.js & Tailwind make writing HTML fun?

If you told me 5 years ago that my favourite part of coding today was writing HTML I'd call you crazy.

But, MY WORD, coding in Blade with Alpine and Tailwind backing it is SUCH a nice experience

— Liam Hammett (@LiamHammett) September 16, 2020

Support the newsletter by becoming a GitHub Sponsor.

Tips

first time using Alpine.js

so far, combine with TailwindCSS is the duo minimalist which is perfect for my needs

— Tony S. (@sanjayatony) September 17, 2020


LOL! I just opened twitter to say something similar. I don't consider myself a front-end expert, so it's always a little rough when working with that end of things. But, I just spent the morning with @laravelphp blade, @Alpine_JS, and @tailwindcss....and it's been fantastic..! 🤓

— Travis Elkins (@traviselkins) September 16, 2020


With respect to @LaravelLivewire, @tailwindcss and @Alpine_JS combinations, I've found that is easier and quicker to roll-your-own to meet specific requirements than to install, configure and customise some third-party package. This is a big deal.

— Chris (@ninthspace) September 12, 2020

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:

  • codeexposed.com by @vitormiguellima is built with Alpine, Tailwind and Laravel
  • sponsorgap.com by @toomaime keeps leveraging Alpine.js for new features

Demos:

  • an interactive search bar clear button by @asantibanez with Alpine and Livewire Such
  • a modal component with Tailwind and Alpine.js by @pixelcave_john
  • Multi Range Slider with Alpine.js by @TwComponents
  • Modal animation for Tailkit using Alpine.js transitions by @pixelcave_john

Articles & Tutorials

[Video] How to: Use Alpine.js to show and hide a menu by @dennisvdalen

How I Redesigned My Laravel Blog (Again) by @christophrumpel

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

github.com/jcergolj/laravellte by @jcergolj has been upgrade to Laravel 8.0, Livewire 2.0 and Alpine.js 2+

github.com/willard/wp-landing-page - A WordPress plugin starter kit for Landing Pages with Alpine.js & Tailwind by @MacayWillard

github.com/KevinBatdorf/alpine-inline-devtools - Inline DevTools package for developing with Alpine.js by @kevinbatdorf has v0.6 release which allows you to update strings in Alpine components.

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