Alpine.js Courses and Certifications

Alpine.js Essentials

Define behavior directly in your markup with Alpine.js: data binding, two-way binding, state toggling, transitions, custom events, and building a memory game and TodoMVC app.

• Laracasts
• 2 hours 30 minutes
• Self-Paced
• Paid Course

Build a Notes App with Alpine.js

Build a working browser-based notes app while practicing Alpine.js state management, note switching, persistence, ordering, and deletion.

• Independent
• 55 minutes
• Self-Paced
• Free Online Course

Traversy Media

Alpine.js Crash Course

Learn Alpine.js for adding lightweight, interactive behavior to HTML pages through directives, state, events, stores, and plugins.

• YouTube
• 42 minutes
• Self-Paced
• Free Video

Learn Alpine JS

Alpine.js offers the reactive and declarative nature of big frameworks like Vue or React at a much lower cost. This interactive course will teach you the basics in less than an hour.

• Scrimba
• 1 hour 4 minutes
• Self-Paced
• Paid Course

Scrimba

Discovering Alpine.js by Coding a Cookie Consent Banner - JavaScript Tutorial

Explore Alpine.js through hands-on coding of a cookie consent banner. Learn its basics, use cases, implementation, and pros/cons in this interactive JavaScript tutorial.

• YouTube
• 1 hour 2 minutes
• Self-Paced
• Free Video

Modals with the TALL Stack

Build dynamic modals in the TALL stack: turn basic HTML and CSS into Blade + Alpine components, toggle with URI hashes and events, and manage state with Livewire.

• Laracasts
• 1 hour 17 minutes
• Self-Paced
• Paid Course

Sprinkle declarative, reactive behaviour on your HTML with Alpine JS

Add declarative, reactive behaviour to HTML with Alpine's directives — x-on, x-show, x-for, x-model, x-ref, x-init — plus modifiers and magic properties like $refs and $watch.

• egghead.io
• 18 minutes
• Self-Paced
• Paid Course

Scrimba

Learn Alpine JS - Full Course for Beginners

Learn Alpine.js to add reactive, declarative interactivity to websites through components, UI patterns, data fetching, and transitions.

• YouTube
• 1 hour 2 minutes
• Self-Paced
• Free Video

Confreaks

Django + Alpine.js + htmx Ups & Downs

Explore the practical experiences of combining Django with Alpine.js and htmx, examining both successful implementations and potential pitfalls to consider when building modern web applications without heavyweight frontend frameworks.

• YouTube
• 46 minutes
• Self-Paced
• Free Video

Build a Video Game Aggregator

Build a video game app in Laravel that pulls IGDB API data, styling responsive pages with Tailwind CSS and adding search dropdowns and modals with Livewire and Alpine.js.

• Laracasts
• 4 hours 27 minutes
• Self-Paced
• Paid Course

Build a Voting App

Build a UserVoice-style voting app with the TALL stack: idea posting, voting, filters, comments, spam moderation, notifications, and feature tests written along the way.

• Laracasts
• 18 hours 19 minutes
• Self-Paced
• Paid Course

Andre's Larabits

Pick up short, standalone lessons on Laravel enums, signed routes and factories, Vue's Composition API, Alpine plugins, Pest, CSS subgrid and browser APIs like Web Share.

• Laracasts
• 6 hours 59 minutes
• Self-Paced
• Paid Course

Andrew's Larabits

Pick up short standalone Laravel techniques: Eloquent model events, Sanctum and Socialite authentication, Fortify two-factor, MySQL JSON columns, broadcasting, Octane, plus Vue transitions, Pinia and Alpine.js.

• Laracasts
• 3 hours 51 minutes
• Self-Paced
• Paid Course

Wordle Workshop

Build a kid-friendly Wordle clone from scratch, using dynamic grids, guess validation, tile feedback, and a polished on-screen keyboard.

• Laracasts
• 2 hours 21 minutes
• Self-Paced
• Paid Course

Build a Livewire App With Me!

Build a functional podcast app prototype with Livewire Volt, Alpine.js, and Reverb, including scheduled playback, a waiting room, real-time chat, and emoji reactions.

• Laracasts
• 3 hours 26 minutes
• Self-Paced
• Paid Course