English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 31 lectures (5h 24m) | 3.96 GB
With alpinejs you use cool JavaScript features the easy way! I show you how that works!
Alpine.js is a very cool and very easy way to implement some everyday’s JavaScript functionality on your web pages.
It is so easy that you do not even have to learn JavaScript at all to use many of those features!
But also for many of you, who have already worked with JavaScript, Alpine.js will be a big improvement on implementing certain tasks.
Alpine.js is super modern and you really should know it.
You can also use Alpine.js together with normal JavaScript or e.g. together with jQuery without any problems.
Compared to jQuery for instance you can solve certain problems with MUCH LESS EFFORT!
If you already know vue.js (or have heard of it) you will see that you can implement many features of vue.js, but you do not have this complicated installation and setup process, and also Alpine.js is much easier to integrate in any existing application or web page!
In Alpine.js for instance, you have this cool feature of “double binding”, that you might know from react, angular or vue.js. But it comes at a much lower cost in terms of getting this whole thing running!
I highly advise you to invest just a few hours to learn something that is new and really cool and that will make your programming live much easier!
What you’ll learn
- Understand Alpine JS
- Use Alpine JS
Table of Contents
Alpine JS Quick Start – Learning Part 1
1 The new version Alpine.js V3 a short introduction
2 Preparation Editor, Plugins, Browser
3 How to use this course the most efficient way
5 Object and Scope Where is your object visible
6 x-bind () – manipulate HTML attributes
7 x-model set object value to input value
8 x-show x-if Hide or show elements 2 different ways
9 x-on x-ref $refs
10 Improvements in Alpinejs Version 3 on event listeners (x-on)
11 Recap of what you learned so far
Time to practice
12 Practical Section #1 – Introduction + exercise files
13 Tabs example challenge
14 Tabs challenge solution
15 Simple calculator challenge
16 Simple calculator solution
17 Color Slider challenge
18 Color Slider solution
Learning Part 2
19 Section Introduction
20 Function Calls in Alpinejs
21 Functions with properties + @submit.prevent
22 Components and parameters + external file example
23 Refactor Color Slider Example
24 Refactor Tabs Example
25 Transitions with modifiers on x-show
26 Transitions with x-transition
27 x-cloak Hiding elements until Alpine finishes loading
28 x-for Loops in Alpinejs
29 Loops + index HTML-Output Refactoring Tabs to be totally flexible
30 x-init Inject data in your alpine component
31 RECAP Usage of functions
Resolve the captcha to access the links!