Get in Touch

Course Outline

Introduction

  • Overview of Alpine JS
  • Understanding Alpine JS directives

Getting Started

  • Understanding Alpine JS's role in modern web design
  • Learning when to use Alpine JS versus a full-fledged web framework
  • Installing Alpine JS
  • Creating an Alpine JS program

Using Alpine JS

  • 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
  • Setting the content of elements: x-text and x-html

Initialisation of Alpine JS Components

  • Running code on element initialisation: x-init
  • Responding to dependency changes: x-effect
  • Referencing elements by key: x-ref

Troubleshooting

Summary and Next Steps

Requirements

  • Basic understanding of web frameworks
  • Experience with fundamental coding for web design
  • JavaScript programming experience

Audience

  • Developers
 14 Hours

Number of participants


Price per participant

Testimonials (4)

Provisional Upcoming Courses (Require 5+ participants)

Related Categories