First, for reactivity to engage, you must enclose the markup in an x-data directive. If you remove this directive, the x-text will not take effect. So, the x-data directive creates an Alpine component. In this case, the directive is empty, but in real usage you almost always have data in there; after all, you’re writing components whose purpose is to be reactive to that data.
Second, you can put any valid JavaScript into the x-text. This is true of all Alpine directives. The x-text property gives you a link between the HTML (the view) and the JavaScript (the behavior).
Alpine and HTMX
Alpine uses HTML attributes to define its functionality, which makes it in some ways similar to HTMX. Although they do different things, both technologies use HTML extension props with the x-prefix to bootstrap powers onto plain old HTML.
Using the x-data and x-text elements
The x-data contents are provided to all the contained elements. To understand what I mean, look at the following code: