What's Inside The Course | Laravel Daily

Autoplay
Autocomplete

Previous Lesson Complete and Continue

Practical Alpine.js From Scratch

Intro

What's Inside The Course (2:29)

12 Practical Examples

First Practical Example: Alpine.js vs jQuery vs Vanilla JS (5:52)
Show/Hide Password: x-bind, x-text and Methods in x-data (3:45)
Multi-Step Form: Dynamic CSS Classes with :class (2:58)
Show/Hide Modals: Buttons, Escape Key, Clicking Outside (3:28)
Slow Connection and x-cloak (2:21)
Form with Progress Bar: x-model, x-ref, and More x-bind Examples (3:53)
Multiple Alpine Components on Page: Events and Parameters (3:21)
Countdown Timer: x-init with Vanilla JavaScript Syntax (1:51)
Visual Effects of Show/Hide with x-transition (1:45)
Live Character Count: Template Literals with Expressions (2:32)
Live-Search: x-for with index (2:26)
Color Picker: Mini-Recap of What We've Learned So Far (2:05)

Alpine Structure in Real-Life Laravel Projects

Several Ways to Install/Initialize Alpine (3:23)
Load Larger JS Methods Externally: For Alpine or x-data (2:48)
Alpine Inside Blade Components (3:48)

Passing Data From/To Alpine

"Hardcoding" Data in Blade from Controller (3:37)
Getting Alpine Data from External/Internal API (4:05)
Livewire + Alpine: Data in Both Directions (4:19)

What's Inside The Course

Complete and Continue

Discussion

0 comments

Lesson Content Locked

Your session expired. Please sign in again to continue.

Login