Course Outline
Introduction
- Overview of Alpine JS
- What are the Alpine JS directives
Getting Started
- Understanding Alpine JS’ role in modern web design
- Learning to use Alpine JS and when to use a full-fledge web framework
- Installing Alpine JS
- Creating Alpine JS program
Using the AlpineJs
- Reusing data objects with Alpine.data
- Declaring a global data store: Alpine.store
Alpine JS Directives
- Declaring website data: x-data
- Adding toggles: x-show
- Custom events and Event Modifiers with x-on
- Setting dynamic HTML attributes: x-bind
- Advanced attribute binding with x-bind
- Binding data to form elements: x-model
- Setingt the content of elements: x-text and x-HTML
Initialization of Alpine JS Component
- Running code on element initialization: x-init
- Responding to dependency changes: x-effect
- Reference elements by key: x-ref
Troubleshooting
Summary and Next Steps
Requirements
- Basic understanding of web framework
- Experience with basic coding for web design
- JavaScript programming experience
Audience
- Developers
Testimonials (3)
Project folder and files with exercises all available to us with a virtual desktop, pair programming during the exercises
Jacob Flynn - Chemist4U
Course - React with Next.js
Good coding practices, thanks to the training I see gaps in my code and know how to improve it. Many concrete solutions that are helpful during work with Quasar.
Bartlomiej - Urzad Dozoru Technicznego
Course - Quasar Framework and Vue.js
Machine Translated
I enjoyed the information provided, the precision in explaining how to write code, and the support in case we encounter any problems. I highly recommend it!
Mateusz - Urzad Dozoru Technicznego
Course - Vue 3
Machine Translated
