šŸŽ‰ To celebrate crossing 1k users, Adonis Mastery Pro is 50% off all through August. Go Pro!
Reusable Edge components with Alpine.js

Reusable Edge components with Alpine.js

3 lessons
Start course

As developers, we often find ourselves abstracting functionality for reusability. Edge has this amazing concept of component, which allows reusability across views. In this course, we are going to pair that with Alpine.js to create practical and reusable components.


We kick off the course by installing Alpine.js in our AdonisJS application.

What you'll learn

  • How to install Alpine.js in AdonisJS and compile with Encore
14m 47s

In this lesson, we create our first Edge components, which is a modal component.

What you'll learn

  • What are Edge components
  • How to create and use Edge components
  • Integrate Alpine component with Edge components

To wrap up this course, we create one more component. This time a dropdown component.

What you'll learn

  • How to create and use nested Edge components
  • Using slots to pass data to Edge components
  • Using Edge components are tags
Chimezie Enyinnaya

Hi, I'm Chimezie Enyinnaya, your teacher.

Iā€™m a self-taught software developer based in Lagos, Nigeria, with over 8 years of experience. In the last couple of years, I've been doing more teaching because I enjoy sharing my knowledge so that others can benefit from it. Come along as I teach you all I know about AdonisJS, Node.js, and JavaScript at large!